Antje Hofmann: changin Image and Map

Beitrag lesen

Hallo Thomas,

Ich muß ja auch jeweils die ImageMap auswechseln. Ich suche eine Funktion, mit der ich die Maps
über MouseOver;Out ect. genauso wie die Images wechseln kann.

folgendes Beispiel geht im IE und den NN ab der 4:

<html>
<head>

<script language="JavaScript">
<!--
  x='<map name="apl">'
+'<area shape="RECT" coords="21,53,169,95" href="seite1.htm"  onMouseOut="alert('ja');" alt="">'
+'<area shape="RECT" coords="69,99,116,166" href="seite2.htm" onMouseOut="alert('ja');"  alt="" target="Fensterx">'
+'</map>';

y='<map name="apl">'
+'<area shape="RECT" coords="21,53,169,300" href="seite4.htm"  onMouseOut="alert('nein');" alt="">'
+'</map>';

function setImage () {
if (document.all) document.all.test.innerHTML=x;
else {
  document.test.document.open();
  document.test.document.write(x+'<img src="cefap_1.gif" width="532" usemap="#apl" height="351" border="0" alt="">');
  document.test.document.close();
  }
return
}

function setImage2 () {
if (document.all) document.all.test.innerHTML=y;
else
{document.test.document.open();
document.test.document.write(y+'<img src="test.gif" width="532" usemap="#apl" height="351" border="0" alt="">');document.test.document.close(); }
return
}

//-->
</script>

</head>
<body text="#000000" bgcolor="#FFFFFF" link="#FF0000" alink="#FF0000" vlink="#FF0000">

<div id="test" style="position:absolute;"></div>
<img src="test.gif" width="532" usemap="#apl" height="351" border="0" alt="">
<a href="javascript:setImage()">setz</a>

<a href="javascript:setImage2()">setz</a>

</body>
</html>

das Grundprinzip: Man greift auf das Dokumentenmodell des Navigators zurück. Entscheidend ist, auch das Bild selbst muß dynamisch geschrieben werden.

Beim IE selbst reicht es die Koordinaten zu ändern. Schaue da mal bei den Eigenschaften von document.all nach.

Ansonsten, kann man Imagemaps beliebig angeben, solange man Layers verwendet.

Viele Grüße

Antje