Um recht einfach Effekte umzusetzen in CSS mit JavaScript, empfiehlt es sich, ein Framework zu verwenden.
Ich bin gerade dabei, Scriptaculous zu testen.
Allgemeines
Homepage: 1
Beispiele und Anleitungen: 2
Anleitung
1. Scriptaculous downloaden
2. Alle js-Dateien ins Verzeichnis Scripts/scriptaculous der Website kopieren
3. Folgende Zeilen in den Header der Seite einfügen:
<script src="Scripts/scriptaculous/prototype.js" type="text/javascript"></script>
<script src="Scripts/scriptaculous/scriptaculous.js" type="text/javascript"></script>
Beispiel eines Toggle-Effekts
Ziel: ein ausgeblendetes DIV bei Klick auf einen Link einzublenden und bei nochmaligem Klick wieder auszubleden
1. Den DIV per Inline-Tag ausblenden
(div id="suchfeld" style="display:none"></div)
2. Script in eine Funktion packen (oder aber auch gleich direkt ausführen)
function einblenden2(divname) {
Effect.toggle(divname, 'slide');
}
3. Die Funktion einem Link zuweisen
(a href="#"><img src="used/main02/miniicon_search.gif" onClick="einblenden2('suchfeld'); return false;" /></a)
( = <