Hallo,
ich habe über HTML eine Landkarte erstellt mit Mapareas. Ich habe dazu zwei Fragen und bin mir nicht sicher, ob es mit css geht oder eher java, da ich ehrlich gesagt nur Anwender bin, aber bin mit dem Latein ein bisschen am ende. Also angenommen, man geht über das Zeichen Hamburg, dann sollte dann das Logo Hamburg erscheinen, wie geht das oder wo kann ich sowas im Internet nachlesen.
Das nächste ist, wenn man über die Maparea geht, erscheint rechts neben der Karte ein Text. Ist das möglich, dass der Text 10-20 Sekunden angezeigt wird oder kann man das so Einstellen, dass wenn man da drüber geht, dass es erstmal bleibt und erst wenn man über eine andere Maparea geht, dass der alte Text dann verschwindet und der neue Text neue kommt?
Hoffe ihr versteht, was ich meine.
Hier der Code:
Wenn ich eine Lösung gefunden habe, werde ich mich natürlich melden. :)
ich habe über HTML eine Landkarte erstellt mit Mapareas. Ich habe dazu zwei Fragen und bin mir nicht sicher, ob es mit css geht oder eher java, da ich ehrlich gesagt nur Anwender bin, aber bin mit dem Latein ein bisschen am ende. Also angenommen, man geht über das Zeichen Hamburg, dann sollte dann das Logo Hamburg erscheinen, wie geht das oder wo kann ich sowas im Internet nachlesen.
Das nächste ist, wenn man über die Maparea geht, erscheint rechts neben der Karte ein Text. Ist das möglich, dass der Text 10-20 Sekunden angezeigt wird oder kann man das so Einstellen, dass wenn man da drüber geht, dass es erstmal bleibt und erst wenn man über eine andere Maparea geht, dass der alte Text dann verschwindet und der neue Text neue kommt?
Hoffe ihr versteht, was ich meine.
Hier der Code:
Code:
<!DOCTYPE html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>test</title>
<style type="text/css">
.point_container {
display: none;
position: absolute;
top: 400px;
left: 1020px;
font-size: 10pt;
color: #111111;
background: #00bffF
}
</style>
<script type="text/javascript">
function showMapInfo(id) {
document.getElementById(id).style.display = "block";
}
function hideMapInfo(id) {
document.getElementById(id).style.display = "none";
}
</script>
</head>
<body>
<div id="hamburg" class="point_container">
<h2>Hamburg </h2>
<p>
tolle Stadt!<br>
</p>
</div>
<div id="Hannover" class="point_container">
<h2>Hannover</h2>
<p>
96, Hauptstadt Niedersachsens<br>
</p>
</div>
<div id="Koeln" class="point_container">
<h2>Köln </h2>
<p>
eine Liebe!<br>
</p>
</div>
<p> <img src="http://www0.xup.in/exec/ximg.php?fid=84604980" alt="Karte" usemap="#Landkarte">
<map name="Landkarte">
<area shape="rect" coords="431,216,478,247" href="http://www.hamburg.de" alt="Hamburg" target="new window"
onmouseout="hideMapInfo('hamburg')" onmouseover="showMapInfo('hamburg')">
<area shape="rect" coords="374,383,406,412" href="http://www.hannover.de" alt="Hannover" target="new window"
onmouseout="hideMapInfo('Hannover')" onmouseover="showMapInfo('Hannover')">
<area shape="rect" coords="131,627,169,656" href="http://www.köln.de" alt="Köln"
onmouseout="hideMapInfo('Koeln')" onmouseover="showMapInfo('Koeln')" target="new window">
</map>
</body>
</html>Wenn ich eine Lösung gefunden habe, werde ich mich natürlich melden. :)
Da müsste dann ja auch die Lösung sein, wie du dort ein Bild rein bekommst
