summaryrefslogtreecommitdiff
diff options
context:
space:
mode:
-rw-r--r--index.php86
-rw-r--r--map.css25
2 files changed, 61 insertions, 50 deletions
diff --git a/index.php b/index.php
index a81aa38..aed6a1a 100644
--- a/index.php
+++ b/index.php
@@ -35,50 +35,52 @@ if($_SERVER['HTTP_HOST'] == 'dev-karte.ffgraz.net') {
<body onload="onLoad()" onunload="GUnload()">
<div id="map" style="width:100%; height:100%;"></div>
- <div id="legendbox" class="box">
- <b>Legende:</b>
- <table class="legend">
- <tr><td align="center"><img src="./img/marker_online.png" /></td><td>&nbsp;</td><td>Online</td></tr>
- <tr><td align="center"><img src="./img/marker_offline.png" /></td><td>&nbsp;</td><td>Offline</td></tr>
- <tr><td align="center"><img src="./img/marker_tunnel.png" /></td><td>&nbsp;</td><td>Tunnel</td></tr>
- <tr><td align="center"><img src="./img/link_green.png" /></td><td>&nbsp;</td><td>Gut</td></tr>
- <tr><td align="center"><img src="./img/link_yellow.png" /></td><td>&nbsp;</td><td>Mittel</td></tr>
- <tr><td align="center"><img src="./img/link_grey.png" /></td><td>&nbsp;</td><td>Schlecht</td></tr>
- <tr><td align="center"><img src="./img/link_blue.png" /></td><td>&nbsp;</td><td>Tunnel</td></tr>
- </table>
- </div>
- <div id="countbox" class="box">
- </div>
- <div id="visibox" class="box">
- <b>Elemente<br />ausblenden</b>
- <form name="visibleform" action="#" onsubmit="return false">
+ <div id="northeastcontainer">
+ <div id="legendbox" class="box">
+ <b>Legende:</b>
<table class="legend">
- <tr>
- <td><input type="checkbox" name="offline" value="true" onclick="javascript:toggleVisible('offline')"></td>
- <td>&nbsp;</td><td align="center"><img src="./img/marker_offline.png" /></td>
- </tr>
- <tr>
- <td><input type="checkbox" name="online" value="true" onclick="javascript:toggleVisible('online')");></td>
- <td>&nbsp;</td><td align="center"><img src="./img/marker_online.png" />&nbsp;<img src="./img/marker_tunnel.png" /></td>
- </tr>
- <tr>
- <td><input type="checkbox" name="bad" value="true" onclick="javascript:toggleVisible('bad')" checked="checked"></td>
- <td>&nbsp;</td><td align="center"><img src="./img/link_grey.png" /></td>
- </tr>
- <tr>
- <td><input type="checkbox" name="middle" value="true" onclick="javascript:toggleVisible('middle')"></td>
- <td>&nbsp;</td><td align="center"><img src="./img/link_yellow.png" /></td>
- </tr>
- <tr>
- <td><input type="checkbox" name="good" value="true" onclick="javascript:toggleVisible('good')"></td>
- <td>&nbsp;</td><td align="center"><img src="./img/link_green.png" /></td>
- </tr>
- <tr>
- <td><input type="checkbox" name="tunnel" value="true" onclick="javascript:toggleVisible('tunnel')"></td>
- <td>&nbsp;</td><td align="center"><img src="./img/link_blue.png" /></td>
- </tr>
+ <tr><td align="center"><img src="./img/marker_online.png" /></td><td>&nbsp;</td><td>Online</td></tr>
+ <tr><td align="center"><img src="./img/marker_offline.png" /></td><td>&nbsp;</td><td>Offline</td></tr>
+ <tr><td align="center"><img src="./img/marker_tunnel.png" /></td><td>&nbsp;</td><td>Tunnel</td></tr>
+ <tr><td align="center"><img src="./img/link_green.png" /></td><td>&nbsp;</td><td>Gut</td></tr>
+ <tr><td align="center"><img src="./img/link_yellow.png" /></td><td>&nbsp;</td><td>Mittel</td></tr>
+ <tr><td align="center"><img src="./img/link_grey.png" /></td><td>&nbsp;</td><td>Schlecht</td></tr>
+ <tr><td align="center"><img src="./img/link_blue.png" /></td><td>&nbsp;</td><td>Tunnel</td></tr>
</table>
- </form>
+ </div>
+ <div id="countbox" class="box">
+ </div>
+ <div id="visibox" class="box">
+ <b>Elemente<br />ausblenden</b>
+ <form name="visibleform" action="#" onsubmit="return false">
+ <table class="legend">
+ <tr>
+ <td><input type="checkbox" name="offline" value="true" onclick="javascript:toggleVisible('offline')"></td>
+ <td>&nbsp;</td><td align="center"><img src="./img/marker_offline.png" /></td>
+ </tr>
+ <tr>
+ <td><input type="checkbox" name="online" value="true" onclick="javascript:toggleVisible('online')");></td>
+ <td>&nbsp;</td><td align="center"><img src="./img/marker_online.png" />&nbsp;<img src="./img/marker_tunnel.png" /></td>
+ </tr>
+ <tr>
+ <td><input type="checkbox" name="bad" value="true" onclick="javascript:toggleVisible('bad')" checked="checked"></td>
+ <td>&nbsp;</td><td align="center"><img src="./img/link_grey.png" /></td>
+ </tr>
+ <tr>
+ <td><input type="checkbox" name="middle" value="true" onclick="javascript:toggleVisible('middle')"></td>
+ <td>&nbsp;</td><td align="center"><img src="./img/link_yellow.png" /></td>
+ </tr>
+ <tr>
+ <td><input type="checkbox" name="good" value="true" onclick="javascript:toggleVisible('good')"></td>
+ <td>&nbsp;</td><td align="center"><img src="./img/link_green.png" /></td>
+ </tr>
+ <tr>
+ <td><input type="checkbox" name="tunnel" value="true" onclick="javascript:toggleVisible('tunnel')"></td>
+ <td>&nbsp;</td><td align="center"><img src="./img/link_blue.png" /></td>
+ </tr>
+ </table>
+ </form>
+ </div>
</div>
<div id="addressbox" class="box">
<b>Adresse suchen:</b>
diff --git a/map.css b/map.css
index f203e98..5a73cd6 100644
--- a/map.css
+++ b/map.css
@@ -26,23 +26,32 @@ div.box {
filter: alpha(opacity=70);
}
-#legendbox {
+#northeastcontainer {
position: absolute;
right: 10px;
- top: 4em;
+ top: 5ex;
+ padding: 0;
+}
+
+#legendbox {
+ margin-left: auto;
+ margin-right: 0;
}
#countbox {
- position: absolute;
- top: 20em;
- right: 10px;
+ width: 70%;
+ margin-top: 1ex;
+ margin-left: auto;
+ margin-right: 0;
font-weight: bold;
+ text-align: center;
}
#visibox {
- position: absolute;
- top: 24em;
- right: 10px;
+ width: 70%;
+ margin-top: 1ex;
+ margin-left: auto;
+ margin-right: 0;
}
#addressbox {