nicht angemeldet
Moin.
Ich bin am Entwickeln einer Webseite für unseren Faschingsverein.
Ich habe ein Gruppenfoto als Image-Map eingebunden und möchte nun als Tooltip (beim Überfahren der Köpfe) den Namen und die Vereinsfunktion als Layer (div-Element) ausgeben. Nur leider funktioniert die Abfrage der Mausposition nicht. Der Layer erscheint wie im style-Bereich angegeben und alert() sagt, dass clientX undefiniert ist. Ich hoffe ihr könnt mir helfen.
Minimal-Quellcode:
<html>
<head>
...
<style type="text/css">
.layertext { position:absolute; top:1px; left:1px; visibility:hidden; }
</style>
<script type="text/css">
function InfoBox(evt, idname, status) {
alert(evt.clientX);
document.getElementById(idname).style.left = evt.clientX + "px";
document.getElementById(idname).top = evt.clientY + "px";
document.getElementById(idname).style.visibility = status;
}
</script>
</head>
<body>
<img src="pics/foto.jpg" style="width:600px; height:445px; border:none" alt="Elferrat" usemap="#Elferrat">
<map name="Elferrat">
<area shape="rect" coords="..." nohref onclick="InfoBox(InfoBox,'Braun','visible')" onmouseout="LayerOff(InfoBox,'Braun','hidden')">
<area shape="rect" coords="..." nohref onclick="InfoBox(InfoBox,'Rehwagen','visible')" onmouseout="LayerOff(InfoBox,'Rehwagen','hidden')">
<area shape="rect" coords="..." nohref onclick="InfoBox(InfoBox,'Ullmann','visible')" onmouseout="LayerOff(InfoBox,'Ullmann','hidden')">
<area shape="rect" coords="..." nohref onclick="InfoBox(InfoBox,'Gulich','visible')" onmouseout="LayerOff(InfoBox,'Gulich','hidden')">
<area shape="rect" coords="..." nohref onclick="InfoBox(InfoBox,'Otto','visible')" onmouseout="LayerOff(InfoBox,'Otto','hidden')">
<area shape="rect" coords="..." nohref onclick="InfoBox(InfoBox,'Krasselt','visible')" onmouseout="LayerOff(InfoBox,'Krasselt','hidden')">
<area shape="rect" coords="..." nohref onclick="InfoBox(InfoBox,'Kamprad','visible')" onmouseout="LayerOff(InfoBox,'Kamprad','hidden')">
<area shape="rect" coords="..." nohref onclick="InfoBox(InfoBox,'Biber','visible')" onmouseout="LayerOff(InfoBox,'Biber','hidden')">
<area shape="rect" coords="..." nohref onclick="InfoBox(InfoBox,'Seifert','visible')" onmouseout="LayerOff(InfoBox,'Seifert','hidden')">
</map>
<!-- *****Layer fuer Mitglieder *****-->
<div id="Braun" class="layertext">...</div>
<div id="Rehwagen" class="layertext">...</div>
<div id="Ullmann" class="layertext">...</div>
<div id="Gulich" class="layertext">...</div>
<div id="Otto" class="layertext">...</div>
<div id="Krasselt" class="layertext">...</div>
<div id="Kamprad" class="layertext">...</div>
<div id="Biber" class="layertext">...</div>
<div id="Seifert" class="layertext">...</div>
</body>
</html>
Struppi