Bildwechsel beim Überfahren eines Bildlinks

Du kennst bestimmt die kleinen Bilder-Links, die sich beim Überfahren ändern und beim Verlassen wieder zum ursprünglichen Bild werden. Hier wird erklärt, wie sie entstehen

Du kennst bestimmt die kleinen Bilder-Links, die sich beim Überfahren ändern und beim Verlassen wieder zum ursprünglichen Bild werden. Hier wird erklärt, wie sie entstehen

Erstelle 2 Bilder gleicher Größe. Das eine zeigt das Bild an, welches beim Laden der Seite angezeigt werden soll. Das 2. das, was beim Überfahren des Bildes angezeigt werden soll.
Füge nun dies in deinen Quelltext, dort wo der Bild-Link erscheinen soll, ein:

Code:

<a href="link.htm" onmouseover="image.src='BildBeimÜberfahren.jpg';" onmouseout="image.src='BildBeimVerlassen.jpg';"><img name="image" src="DasGleicheBildWieBeiBildBeimVerlassen.jpg" border="0"></a>

Der Anfang ist wie ein normaler Link: Es wird angegeben, wohin der Link führen soll (hier

Code:

link.html

). Beim Befehl

Code:

onmouseover

wird angegeben, wie die URL zu dem Bild heissen soll, das beim Überfahren des Bildes angezeit werden soll. Unter

Code:

onmouseout

wird die URL zu dem Bild angegeben, welches beim Verlassen des Links angezeigt werden soll (logischerweise das gleiche wie beim Laden der Seite). Darauf folgt der normale

Code:

<img>

-Befehl, mit dem Unterschied, dass noch der Zusatz

Code:

name="image"

da ist. Er sagt dem im

Code:

<a href>

-Befehl angegebenen Script (ist nämlich JavaScript) welches Bild es ändern soll (nämlich jenes, welches den Namen "image" hat).

Geschrieben von Phil Marx am 18.06.2004 (5377x gelesen)