Hover mit Transtition

Dieses Script ist eine Mischung aus Javascript und CSS. Es ermöglicht eine ansprechende Menüstruktur, die aufwendiger aussieht, als sie in Wirklichkeit ist.

Das komplette Aussehen kann über das Style-Sheet gesteuert werden.
Ich habe in diesem Script den Effekt "23" Random eingestellt. So wird bei jedem Aufruf ein anderer Effekt ausgewählt.

Beim Firefox wird zwar kein Effekt dargestellt, aber das Menü funktioniert trotzdem einwandfrei.

java24.net Newsletterabo java24.net Die neue Serviceseite DAS java24.net-Forum Newsletterarchiv DIE java24 - TOPLIST DER java24 - Fanshop

Dieser Effekt lässt sich ganz leicht in ein vorhandenes Menü einbauen,
da lediglich folgender Befehl in die Links integriert werden muss:

class="nav" onmouseover="doovernav(this);" onmouseout="dooutnav(this);"

Folgende Effekte sind steuerbar:

0 Box in : 1 Box out
2 Circle in : 3 Circle out
4 Wipe up: 5 Wipe down
6 Wipe right : 7 Wipe left
8 Vertical blinds : 9 Horizontal blinds
10 Checkerboard across : 11 Checkerboard down
12 Random dissolve
13 Split vertical in : 14 Split vertical out
15 Split horizontal in : 16 Split horizontal out
17 Strips left down : 18 Strips left up
19 Strips right down : 20 Strips right up
21 Random bars horiz : 22 Random bars vert
23 Random

Dieses Script läuft auf folgenden Browsern:
	Internet Explorer
	Mozilla Firefox
getestet jeweils mit der aktuellen Version

HTML-Einbindung
   <style type="text/css"> A.nav{ font:normal x-small verdana, sans-serif; width:150px; height:20px; border: 1px solid #ffffff; color:navy; background: #e0e0e0; text-decoration: none; cursor:pointer; display: block; } A.nav:Hover{ color:red; width:150px; border: 1px solid #ffffff; background: #ffffff; text-decoration: none; display: block; } </style> <script type="text/javascript" language="JavaScript">  </script>   <a href="http://www.java24.net" class="nav" onmouseover="doovernav(this);" onmouseout="dooutnav(this);">java24.net</a> <a href="http://www.abo.java24.net" class="nav" onmouseover="doovernav(this);" onmouseout="dooutnav(this);">Newsletterabo java24.net</a> <a href="http://www.service.java24.net" class="nav" onmouseover="doovernav(this);" onmouseout="dooutnav(this);">Die neue Serviceseite</a> <a href="http://www.toplist.java24.net" class="nav" onmouseover="doovernav(this);" onmouseout="dooutnav(this);">DAS java24.net-Forum</a> <a href="http://www.newsletter.java24.net" class="nav" onmouseover="doovernav(this);" onmouseout="dooutnav(this);">Newsletterarchiv</a> <a href="http://www.toplist.java24.net" class="nav" onmouseover="doovernav(this);" onmouseout="dooutnav(this);">DIE java24 - TOPLIST</a> <a href="http://www.equisto.de/java24" class="nav" onmouseover="doovernav(this);" onmouseout="dooutnav(this);">DER java24 - Fanshop</a>

Hier kannst Du Dir das Javascript einfach per eMail zusenden lassen.

Mail:

Name:

Abo
Wenn Du den Newsletter beziehen möchtest, klicke bitte in das Feld "Abo"