ERacer: Imagemap mit onClick funzt nicht

Beitrag lesen

Hallo,

folgendes Problem: Ich habe eine Imagemap als Navigation, die einzelnen area´s sollen ein Bild austauschen. Das funktioniert auch mit "onMouseOver und onMouseOut", jedoch nicht mit "onClick". Das Bild soll aktiv bleiben bis zum nächsten Klick.

Kann man "onClick" nicht auf Imagemaps anwenden. Wenn ich anstatt der Imagemapbereiche normale Links mit "onClick" versehe funktioniert mein Script 1A!

Hier der Quelltext:

<script language="JavaScript">
if (navigator.appVersion.indexOf("2.") != -1){
check = false;
}
if ((navigator.appVersion.indexOf("3.") != -1) && (navigator.appName.indexOf("Explorer") != -1)){
check = false;
}
else
{
check = true;
}
if (check == true){
 image0 = new Image();
 image0on = new Image();
 image0alt = new Image();

image0.src = "images/blink-off.gif";
 image0on.src = "images/blink-on.gif";
 image0alt.src = "images/blink-on.gif";

image1 = new Image();
 image1on = new Image();
 image1alt = new Image();

image1.src = "images/blink-off.gif";
 image1on.src = "images/blink-on.gif";
 image1alt.src = "images/blink-on.gif";

image2 = new Image();
 image2on = new Image();
 image2alt = new Image();

image2.src = "images/blink-off.gif";
 image2on.src = "images/blink-on.gif";
 image2alt.src = "images/blink-on.gif";

image3 = new Image();
 image3on = new Image();
 image3alt = new Image();

image3.src = "images/blink-off.gif";
 image3on.src = "images/blink-on.gif";
 image3alt.src = "images/blink-on.gif";

image4 = new Image();
 image4on = new Image();
 image4alt = new Image();

image4.src = "images/blink-off.gif";
 image4on.src = "images/blink-on.gif";
 image4alt.src = "images/blink-on.gif";

image5 = new Image();
 image5on = new Image();
 image5alt = new Image();

image5.src = "images/blink-off.gif";
 image5on.src = "images/blink-on.gif";
 image5alt.src = "images/blink-on.gif";
 }
imagealt = ""
function imageon(name){
 if (imagealt != name){
         document[name].src = eval(name + "on.src");
 }
}
function imageoff(name){
 if (imagealt != name){
         document[name].src = eval(name + ".src");
 }
}
function on(name){
        if (check == true){
 imageon(name);
 }
}
function off(name){
        if (check == true){
 imageoff(name);
 }
}
function click(name){
 if (check == true){
 alert(name);
 document[name].src = eval(name + "alt.src");
 if (imagealt != name){
  if (imagealt != ""){
   document[imagealt].src = eval(imagealt + ".src");
  }
 }
 imagealt = name
 }
}

// -->
</script>

</HEAD>

<BODY BGCOLOR="#A7A7A7" TEXT="#000000" >

<map name="FPMap0">
    <area href="#" shape="polygon" onmouseover="on('image0');" onmouseout="off('image0');" onclick="click('image0');" coords="45, 0, 0, 68, 0, 83, 15, 83, 68, 0">
    <area href="#" shape="polygon" onmouseover="on('image1');" onmouseout="off('image1');" onclick="click('image1');" coords="73, 0, 20, 83, 45, 83, 99, 0" >
    <area href="#" shape="polygon" onmouseover="on('image2');" onmouseout="off('image2');" onclick="click('image2');" coords="105, 0, 51, 83, 75, 83, 129, 0">
    <area href="#" shape="polygon" onmouseover="on('image3');" onmouseout="off('image3');" onclick="click('image3');" coords="134, 0, 83, 83, 107, 83, 160, 0">
    <area href="#" shape="polygon" onmouseover="on('image4');" onmouseout="off('image4');" onclick="click('image4');" coords="165, 0, 112, 83, 137, 83, 193, 0">
    <area href="#" shape="polygon" onmouseover="on('image5');" onmouseout="off('image5');" onclick="click('image5');" coords="142, 83, 175, 33, 195, 46, 172, 83" >
    </map><img border="0" src="images/menue.gif" usemap="#FPMap0" width="196" height="83">

<img border="0" name="image0" src="images/blink-off.gif" width="31" height="27"><img border="0" name="image1" src="images/blink-off.gif" width="31" height="27"><img border="0" name="image2" src="images/blink-off.gif" width="31" height="27"><img border="0" name="image3" src="images/blink-off.gif" width="31" height="27"><img border="0" name="image4" src="images/blink-off.gif" width="31" height="27"><img border="0" name="image5" src="images/blink-off.gif" width="31" height="27">