Grafik bei Mausberührung ändern lassen

Scripting-Tipps - JavaScript


Manchmal kann es sinnvoll sein, eine Grafik bei Berührung mit der Maus wechseln zu lassen. Möglich gemacht wird dies durch ein wenig Unterstützung eines JavaScripts. Sobald der Mauszeiger das Bild berührt, ändert sich dies zu einem anderen Bild. Fügen Sie dazu einfach das folgende JavaScript in Ihre Webseite ein.


Beispiel:

<html>
<head>
<script language="JavaScript">
<!--
i01 = new Image();
i01.src = "bild1.gif"; /* 1. normale Grafik */
i02 = new Image();
i02.src = "bild2.gif"; /* 1. Grafik bei Mausberührung */

i03 = new Image();
i03.src = "bild3.gif"; /* 2. normale Grafik */
i04 = new Image();
i04.src = "bild4.gif"; /* 2. Grafik bei Mausberührung */

function BildVeraendern(ImageName, ImageObjektName)
{
    // ImageName - Name des auszutauschenden Bildes
    // ImageObjektName - Name des Bildes mit dem ausgetauscht wird
    document.images[ImageName].src = eval(ImageObjektName + ".src")
}
//-->
</script>
<title>Grafik bei Mausberührung ändern lassen</title>
</head>
<body>

<img src="bild1.gif" name="urlaub" onMouseOver="BildVeraendern('urlaub', 'i02');" onMouseOut="BildVeraendern('urlaub', 'i01');">
<br /><br />
<img src="bild3.gif" name="ostern" onMouseOver="BildVeraendern('ostern', 'i03');" onMouseOut="BildVeraendern('ostern', 'i04');">

</body>
</html>





Weitere Artikel: