mouseover und mouseout

[juppi]

hallo,

wenn ich mit der Maus über ein <img>-Element fahre, dann ändere ich mit der mouseover-Methode das Bild und wenn ich dann das Bild wieder verlasse, dann setze ich das Bild mit der mouseout-Methode zurück, so wie es anfänglich "aussah", z.b.:

<img id="bild" src="bild.jpg" onmouseover="src='bild_on.jpg'" onmouseout="src='bild.jpg'" alt="" />

das ist mir zuaufwendig, da ich über 200 <img>-Elemente habe und jedesmal sowas zuschreiben, da wir man irre.

Gibt es mit JavaScript eine Möglichkeit sowas besser und übersichtlicher hinzubekommen?

Zum Beispiel, denke ich an einer Funktion, die das ganze steuert...

<script type="text/javascript">  
/* <![CDATA[ */  
  
function mauscontrol (bild1, bild2) {  
 if (mouseover) {  
  document.getElementById('bild').src ='images/'+ bild1 +'.gif'  
 } else if (mouseout) {  
  document.getElementById('bild').src ='images/'+ bild2 +'.gif'  
 }  
}  
  
/* ]]> */  
</script>

<immg id="bild" src="bild1" onmouseover="mauscontrol('bild1', 'bild2')" alt="" />

Das ist zwar nicht die "Lösung" aber sowas in die Richtung suche ich. Wäre super wenn jemand mir weiterhelfen würde.

Schönen Abend
juppi