Salü Gina,


Ich bin über dein altes code.js gestolpert, wo du immer wieder repetitive Javascript Rollovers mit den dazugehörigen Images programmierst. Das geht auch einfacher:

Schau dir den Sourcecode dieses Dokumentes an.
Zuerst musst du das Javascript Library jquery-1.2.2.pack.js im <head> einbinden: <script src="jquery-1.2.2.pack.js"></script>
Danach das neue code.js: <script src="code.js"></script>

Jede Grafik, die ein Rollover werden soll muss noch die Stylesheet-klasse .roll bekommen: <img src="face_lo.png" alt="" class="roll">

Wichtig ist, das du du immer zwei Versionen von Grafiken abspeicherst. Einmal mit dem Namen xyname_lo.xyz und einmal xyname_hi.xyz. Dann klappts!
Vorher: Nachher:
<script src="jquery-1.2.2.pack.js"></script>
<script src="code.js"></script>

nav0_lo = new Image();
nav0_hi = new Image();
nav0_lo.src = "/img/nav1_unternehmen_lo.gif";
nav0_hi.src = "/img/nav1_unternehmen_hi.gif";
...
<script src="code.js"></script>
<a href="portrait.html" onMouseOver="changeImage('nav','unternehmen','nav0_hi')" onMouseOut="changeImage('nav','unternehmen','nav0_lo')">
 <img src="nav1_unternehmen_lo.gif" width="113" height="27" border="0" name="unternehmen" alt="">
</a>
<a href="portrait.html">
 <img src="face_lo.png" alt="" class="roll">
</a>
Fehleranfällig, da code.js und das HTML zusammen korrespondieren müssen. Gibts ein zweites Rollover, müssen beide Dateien erweitert werden. Easy peacy, japaneasy!

Viel Spass! - Thömi