onClick in image map

[js]

Hallo,

ich habe ein Bild. Dieses Bild ist eine Image Map. Die Links funktionieren einwandfrei. Nun möchte ich, dass sich das Bild bei Klick auf einen Hotspot/bestimmten Bereich ändert.
Bei "einfachen" Bildern mache ich das ja mit dem "onClick"-Befehl. Aber da handelt es sich auch immer um einen Link. Bei meiner Image Map sind es mehr und je nach dem wo man klickt, wird das Bild durch ein anderes ersetzt. Der Befehl "onClick" funktioniert hier leider nicht - zumindest tut sich bei mir hier im Moment garnichts.

=> hier mal mein Quelltext für das Bild:

<img name="bild" src="bilder/bild1.gif" width="202" height="200" border="0" usemap="#m_bildframe" style="position:absolute;top:0px;left:0px">

<img name="bildframe" src="bildframe.gif" width="202" height="200" border="0" usemap="#m_bildframe" alt=""><map name="m_bildframe">
<area shape="poly" coords="82,0,93,0,93,9,82,9,82,0" href="bild6.htm" target="bildframe">
<area shape="poly" coords="67,0,78,0,78,9,67,9,67,0" href="bild5.htm" target="bildframe" >
<area shape="poly" coords="52,0,63,0,63,9,52,9,52,0" href="bild4.htm" target="bildframe">
<area shape="poly" coords="37,-2,48,-2,48,9,37,9,37,-2" href="bild3.htm" target="bildframe">
<area shape="poly" coords="22,-2,33,-2,33,9,22,9,22,-2" href="bild2.htm" target="bildframe">
<area shape="poly" coords="7,-2,18,-2,18,9,7,9,7,-2" href="bild1.htm" target="bildframe">
</map>

<=

Ich habe es mit onClick ganz normal, wie bei anderen Bildern im Link-Bereich probiert. Leider tut sich da wie gesagt nichts. Wo müsste ich den Befehl eingeben oder geht es garnicht so? Welche Möglichkeit gibt es dann?

Danke für Hilfe!

CU

[Herbert]

Hallo

Was passiert wenn Du den onClick-Handler im area-Tag plazierst?

Gruss

[js]

Hallo,

auch nichts.

Befehl >> onClick="pic('bild2')" << verweist auf eine externe JavaScript-Datei mit folgendem Code:

var navi1 = new Image();
var navi2 = new Image();
var navi3 = new Image();

navi1.src = "bilder/bild1.gif";
navi2.src = "bilder/bild2.gif";
navi3.src = "bilder/bild3.gif";

function pic(picimage) {
eval("document['bildframe'].src = " + picimage + ".src");
}

<<<

Das funktioniert bei anderen Bildern so immer.
Da kann man das aber auch direkt in den Link-Bereich (<a href="..." onClick="pic('bild2')" ...><img name="..." ...></a>) einfügen.
Beim image map gibt's ja nur einen Tag < ... >. Der Link-Bereich ist da nicht gesondert.

(edit: <img name="bildframe">)

MfG

[Struppi]

auch nichts.

stimmt nicht, mach mal ein alert('nix'); in den href Teil.

Befehl >> onClick="pic('bild2')" << verweist auf eine externe JavaScript-Datei mit folgendem Code:

var navi1 = new Image();
var navi2 = new Image();
var navi3 = new Image();

navi1.src = "bilder/bild1.gif";
navi2.src = "bilder/bild2.gif";
navi3.src = "bilder/bild3.gif";

function pic(picimage) {
eval("document['bildframe'].src = " + picimage + ".src");
}

eval ist evil'1

Woher hast du diesen Code?

document['bildframe'].src = window[picimage].src;

macht das gleiche ohne die bekannten Nachteil von eval.

Da kann man das aber auch direkt in den Link-Bereich (<a href="..." onClick="pic('bild2')" ...><img name="..." ...></a>) einfügen.
Beim image map gibt's ja nur einen Tag < ... >. Der Link-Bereich ist da nicht gesondert.

Nein, bei der Map gibt es für jeden Bereich ebenfalls einen href="..." teil und  dort kannst du auch den onclick HAndler einbauen.

Struppi.

[Detlef G.]

Hallo js,

Befehl >> onClick="pic('bild2')" << verweist auf eine externe JavaScript Datei mit folgendem Code:

^^^^^

OnClick ruft also pic mit bild2 als Parameter auf.

var navi1 = new Image();
...
navi1.src = "bilder/bild1.gif";
...

Deine Images heißen also navi1, navi2, ...

function pic(picimage) {

picimage enthält also also bild2

eval("document['bildframe'].src = " + picimage + ".src");

picimage + ".src" (bild2.src) gibt es nicht.
Es gibt nur navi1.src, navi2.src, ...

Auf Wiederlesen
Detlef