 Bei MouseOver 2 Bilder gleichzeitig tauschen
 Hier werden bei MousOver gleich zwei Bilder gleichzeitig ausgetauscht. Sie werden sehen, eigentlich nichts Neues: Die Funktion zum Bildtausch wurde einfach in einem Link zwei Mal eingesetzt.
OnMouseover = "hiLite('foto1','i02'); hiLite('foto2','i04')"
Bei Mouseover werden die Bild-Objekte "foto1" und "foto2" durch andere, im Head bereits vorgeladenes Images ersetzt. Bei MouseOut werden die ursprünglichen Images wieder angezeigt.
 Textlink mit der Maus überfahren
 Die gleiche Technik für einen Image-Link (Beispiel) 
im HEAD-Bereich
Zuerst werden die 4 Images bekannt gemacht, bekommen einen eindeutigen Namen und werden vorab geladen. Darunter dann die Funktion zum Austausch bei MouseOver und MouseOut.
<script type="text/javascript" language="JavaScript">
<!--
i01 = new Image();
i01.src = "bild1.jpg"; /* normale-Grafik */
i02 = new Image();
i02.src = "bild2.jpg"; /* Highlight-Grafik */
i03 = new Image();
i03.src = "bild3.jpg"; /* normale-Grafik */
i04 = new Image();
i04.src = "bild4.jpg"; /* Highlight-Grafik */
i05 = new Image();
function hiLite(imgID,imgObjName) {
// imgID - Name des auszutauschenden Bildes z.B. foto2
// imgObjName - Name des Bildes mit dem ausgetauscht wird z.B. i02
document.images[imgID].src = eval(imgObjName + ".src")
}
//-->
</script>
Image im BODY-Bereich
Für die zu ändernde Grafik (Foto) wird ein Name vergeben!
Für das 1. Foto: name="foto1"
Für das 2. Foto: name="foto2"
Link im BODY-Bereich
Bei ONMOUSEOVER bzw. ONMOUSEOUT (Eventhandler) wird die Funktion "hiLite" aufgerufen.
Verweis
<a href="#"
OnMouseover = "hiLite('foto1','i02'); hiLite('foto2','i04')"
OnMouseout = "hiLite('foto1','i01'); hiLite('foto2','i03')">
Link mit der Maus überfahren
</a>
Der JavaScript-Befehl für das 2. Bild ist durch Strichpunkt getrennt, zuzsätzlich eingefügt
Zur Anpassung folgende Änderungen im Aufruf:
| Element |
hier im Beispiel |
ersetzen mit |
| i01 - i04 |
bild1.jpg - bild4.jpg |
Dateiname |
| Objektname 1 |
foto1 |
ihr Objektname |
| Objektname 2 |
foto2 |
ihr Objektname |
|
|
WWW.WEB-TOOLBOX.NET
BEISPIEL 
ZURÜCK