4.7 Eine Lightbox verwenden

Problem

Der gegenwärtig angezeigte Inhalt einer Webseite soll mit einem Bild in einer sogenannten Lightbox überlagert werden (siehe Abbildung 4-16), ohne dass hierfür ein Popupfenster im Browser geöffnet werden muss.

Die Seite in der Standarddarstellung

Abbildung 4-16. Die Seite in der Standarddarstellung

Lösung

Verwenden Sie für den Lightbox-Effekt ein spezielles JavaScript. Den Code können Sie unter der Adresse http://www.huddletogether.com/projects/lightbox2/#download herunterladen.

Neben den JavaScript-Bibliotheken Prototype und Script.aculo.us enthält der Code ein spezielles Skript für das Überlagern von Bildern:

<title>Mr. McCool's Homepage</title>
<!-- ...

Get CSS Kochbuch now with the O’Reilly learning platform.

O’Reilly members experience books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.