Und wieder onmouseover
So oft nachgefragt, daher auch hier nochmal.
Beim überfahren des Links mit der Maus ändert sich das GIF. Auch das aktuelle GIF wird anders angezeigt.
Achtung ! WICHTIG !
Achte auf die Namensvergabe im jeweiligen <img...name="BildX"...>-Tag!
Hier kannst du die Demo probieren.
Vorbereitungen
Das folgende Script musst du im <head> ablegen.
<script language="javascript" type="text/javascript">
<!--
// Original modifiziert
// Dank an Christine: http://www.screenExa.net/
// Bilder vorladen
if (document.images)
{
gruenImage = new Image()
gruenImage.src = "blcube.gif" // blaues Gif
grauImage = new Image()
grauImage.src = "wecube.gif" // graues Gif
redImage = new Image()
redImage.src = "recube.gif" // Lampe
}
// Statustext anzeigen, Button gruen
function statusein(Bild,text)
{
window.status = text;
if (document.images)
{
if (Bild.src == grauImage.src)
Bild.src = gruenImage.src;
}
}
// Statustext aus, Button grau
function statusaus(Bild)
{
window.status="";
if (document.images)
{
if (Bild.src == gruenImage.src)
Bild.src = grauImage.src;
}
}
// aktuellen Link kennzeichnen
// dazu alle Buttons grau, dann Button
// gewaehlter Link == 3.Bild
function gewaehlt(Bild)
{
if (document.images)
{
// document.images.length entspricht der Anzahl der
// auf der Website vorhandenen Bilder!
for (i=0; i<document.images.length; i++)
document.images[i].src = grauImage.src;
Bild.src = redImage.src;
}
}
// -->
</script>
Im <body>-Tag musst du folgendes hinterlegen:
<body onLoad="gewaehlt(document.Bild1)">
Achte darauf, die Bilder ordentlich zu benamsen, jedes Bild muss einen anderen Namen erhalten! Hier ein Beispiel:
<a href="#"
onmouseover = "statusein(document.Bild1,'Startseite');
return true"
onmouseout = "statusaus(document.Bild1)"
onclick = "gewaehlt(document.Bild1)">
<img src="bild.gif" name="Bild1" alt="" /></a>
<a href="#"
onmouseover = "statusein(document.Bild2,'Startseite');
return true"
onmouseout = "statusaus(document.Bild2)"
onclick = "gewaehlt(document.Bild2)">
<img src="bild.gif" name="Bild2" alt="" /></a>
