by Gabriele
17. Juli 2010 02:47
Bei reinem CSS wie im vorangegangenen Beispiel kann ein Bildwechsel nur beim Hovern über ein anderes Thumbnail erfolgen. Immerhin ist so eine Bedienung auch mit Browsern möglich, in denen Javascript gar nicht läuft. Für alle anderen erhöht sich der Komfort der Konstruktion mit Hilfe eines kleinen Kniffs. Der Body wechselt beim Anklicken eines Thumbnails seine Klasse, und das gewählte Bild bleibt bis zum nächsten Clickevent sichtbar - sofern kein Hovereffekt es überblendet. Hovern hat immer Vorrang (festgelegt mit z-index). Auch bleibt nun das Thumbnail des jeweils ausgewählten Bildes voll sichtbar, außer die Seite wurde gerade frisch geladen.
Code
Ausprobieren
(getestet mit den aktuellen Versionen von Firefox, Safari, Opera, Internet-Explorer 7 und 8)