Einsatzbereiche für MouseOver-Aktionen
Wird der Mauszeiger über eine Grafik geführt, soll ein Bild-Objekt ausgetauscht werden. Auch Bildwechsel / Image-Change / rollover genannt.
Zunächst einige Demos zu verschiedenen Anwendungen
Sie können ein Bild gegen ein anderes austauschen. Dabei wird entweder eine sichtbare Grafik gegen eine andere sichtbare Grafik getauscht, oder sie lassen eine Grafik 'erscheinen' weil sie eine vorher nicht sichtbare Grafik (transparentes Bild) gegen eine sichtbare austauschen.
 
|
Beispiel 1 für einen 'sichtbaren Bildtausch'
Grafik links mit der Maus überfahren
|

|
Beispiel 2 für einen 'unsichtbaren Bildtausch'
Zum Auslösen der Aktion die Grafik links der Maus überfahren (hier wird zuerst nur ein transparentes Image angezeigt)
|
Sie können den MouseOver-Effekt für eine Grafik auch an einer anderen Position innerhalb ihrer Seite auslösen, nicht unbedingt nur an der Grafik selbst. Dazu steht hier z.B. Der Textlink mit der MouseOver-Anweisung an einer anderen Stelle als das zu tauschende Objekt.
Hier der übliche Einsatz. beim Überfahren mit der Maus wird eine Grafik getauscht. Das, was sie z.B. in einem Menü einsetzen würden. Hier verbirgt sich nicht nur eine MouseOver-Anweisung, sondern die Grafik dient wie man erwartet auch noch als Verweisfläche für einen aktiven Link.

|
Bild als Verweis
Mouseover für Info klicken verweist zur Seite
|

|
Bild als Verweis
Mouseover für Info klicken löst Aktion aus
|
Die Anweisungen für zu tauschende Grafiken können sich auch jedesmal auf ein und dasselbe Objekt beziehen. Die Tauschaktion wird hier ausgelöst durch 'onMouseOver'. Für alle Links wird bei MouseOut immer wieder die Ursprungsgrafik angezeigt.
Die Anweisungen für zu tauschende Grafiken können sich auch jedesmal auf ein und dasselbe Objekt beziehen. Die Tauschaktion wird hier ausgelöst durch onMouseOver. Ein onMouseOut gibts hier nicht.

|