Antje Hofmann: Imagemap in externer Datei?

Beitrag lesen

Hallo Mike,

Wie kann ich ein image map extern in einer Datei zu liegen haben, so dass mehrere html-Seiten die gleiche map benutzen? Wie rufe ich die map auf? Wie nenne ich die Datei? Was muss ich bei relativen Pfadangaben beachten?

Ich habe mal etwas gebastelt und bin auf folgende Javascriptlösung gekommen (da du das sowieso verwendest):

<html>
<head>
<title>Imagemap für mehrere Dateien</title>
<script language="JavaScript" src="map.js" type="text/javascript">
</script>
</head>
<body onLoad="ima()">
<div id="Mapdef" style="position:absolute;top:10px;"> </div> <!-- erhält die Imagemapdefinition -->
<div id="Mapbild" style="position:absolute;top:30px;"> </div> <!-- erhält das Bild-->
</body>
</html>

In der externen JS-Datei dann definieren:

function ima()
{
x='<map name="Ibild">';
x=x+'<area shape="RECT" coords="21,53,169,95" href="Seite1.htm">';
x=x+'<area shape="RECT" coords="69,99,116,166" href="seite2.htm">';
x=x+'<area shape="RECT" coords="121,97,217,161" href="seite3.htm">';
x=x+'</map>';
if (document.all) document.all.Mapdef.innerHTML=x; else
{document.Mapdef.document.open();document.Mapdef.document.write(x);document.Mapdef.document.close();}
}

Damit schreibst du dynamisch das Map in die Seite.

die Bilder dann z.B. so

function bild()
{y='<img src="bild1.gif" usemap="#Ibild" width="532" height="351" border="1">';
if (document.all) document.all.Mapbild.innerHTML=y; else
{document.Mapbild.document.open();document.Mapbild.document.write(y);document.Mapbild.document.close();}
}

Nun reicht es auf jeder Seite die divs anzugeben und mit onload die Funktion ima() aufzurufen
Ich habe es getestet mit Navi 4.06, 4.5, IE 4 und 5

Viele Grüße

Antje