Bildwechsel durch Mausklick |
||
Bild 1 | <a href="#" onMouseUp="Bildwechsel('bild1',Highlight1); return false">Bild 1</a> | |
Bild 2 | <a href="#" onMouseUp="Bildwechsel('bild1',Highlight2); return false">Bild 2</a> | |
Bild 3 | <a href="#" onMouseUp="Bildwechsel('bild1',Highlight3); return false">Bild 3</a> | |
Bild 4 | <a href="#" onMouseUp="Bildwechsel('bild1',Highlight4); return false">Bild 4</a> | |
Bild 5 | <a href="#" onMouseUp="Bildwechsel('bild1',Highlight5); return false">Bild 5</a> | |
Bild | <img src="img/transpix.gif" width="163" height="240" name="bild1" border="0"> |
<head>
<script language="JavaScript">
<!--
Highlight1 = new Image();
Highlight1.src = "img/bild1.gif";
Highlight2 = new Image();
Highlight2.src = "img/bild2.gif";
Highlight3 = new Image();
Highlight3.src = "img/bild3.gif";
Highlight4 = new Image();
Highlight4.src = "img/bild4.gif";
Highlight5 = new Image();
Highlight5.src = "img/bild5.gif";
function Bildwechsel(Bildnr,Bildobjekt)
{
window.document.images[Bildnr].src = Bildobjekt.src;
}
//-->
</script>
</head>
Erklärung:
Hier ist nun kein neuer Lerninhalt hinzugekommen. Das Script im Head erzeugt
wieder aller erforderlichen Image Objekte. In der Funktion werden die Parameter
aufgeführt, die später in den Links vergeben werden. Die Links rufen
mittels Event Handler onMouseUp die Funktion Bildwechsel auf, wodurch die Anweisung
ausgeführt wird.
Zur Erinnerung hier nochmal ein Hinweis zum zweiten Befehl return
false in den Links, der allerdings in diesem Falle bei IE nicht funktioniert..