Mouse Over Buttons

Mouse Over Effekte mit Formularbuttons.

Mit einem einfachen, kleinen JavaScript erzeugt man mit normalen
Formularbuttons
Hover Buttons.

<input type=button
value="Suchen"
style="background: darkblue; font-size: 12px; cursor:hand;
color: white;"
onmouseover="this.style.background=’green’;
this.style.color=’yellow’
;"
onmouseout="this.style.background=’darkblue’;
this.style.color=’white’;
">

Das eigentliche Skript ist hier bei den Eventhandlern versteckt.
Bei "onmouseover" wird über den Befehl this.style.background
die Hintergrundfarbe
verwendet. Mit this wird immer das aktuelle Element angesprochen.
In diesem Fall
also der Button. Mit der zweiten Anweisung bei onmouseover (this.style.color)
wird die Farbe des Inhaltes des Buttons definiert.

Bei onmouseout, also beim Verlassen des Objektes mit der Maus wird
wieder über
die zwei Anweisungen der Anfangszustand hergestellt.

This entry was posted in Javascript Tricks. Bookmark the permalink.

Leave a Reply

Your email address will not be published. Required fields are marked *