Man kann in der Übersicht nach allerlei Kriterien filtern, wie z.B. die verwendete Javascript Bibliothek. Es macht wenig Sinn bei einer vorhandenen Webseite in der schon prototype verwendet wird, eine Lightbox mit jQuery einzubinden.

(via)

Diese Galerie bietet eine Bilderschau der ganz besonderen Art. Entwickelt wurde sie als Studentenprojekt von Benjamin Mack (http://www.xnos.org/). Auf http://typo3.org/extensions/ kann man sich “dam_liteshow” als Extension für Typo3 herunterladen. Zusammen mit “dam” für die äußerst komfortable Medienverwaltung und der “dam_catedit” zur Kategorisierung der Bilder und Fotos. Durch Zuordnung der Bilder zu einer Kategorie entstehen die Ordner für die Slideshow.

Unter http://hebamme-preiss.de finden Sie ein Anwendungsbeispiel.

Besonderheiten und neue Funktionen

• barrierearme XHTML Umsetzung
• ClickandBuy wurde als neuer Paymentdienstleister integriert
• Ajax gestützte Suche

weitere Bilder

Mit dem Javascript Lightbox kann man die Präsentation von Bildern auf einer Webseite sehr unkompliziert aufbohren. Zum Ausprobieren einfach mal das Bild anklicken.

Das Ganze funktioniert natürlich nur, wenn Javascript im Browser aktiviert wurde. Das Gute an der lightbox ist, dass die eigentliche Funktionalität auch dann gegeben ist, wenn Javascript ausgeschalten wurde oder nicht verfügbar ist. Dann öffnet sich das Bild einfach im aktuellen Fenster.

Die Implementierung ist kinderleicht. Mehr dazu gibt es nach einem Klick.

Das Skript nutzt das Ajax Framework Prototype sowie die Effektbibliothek Scriptaculous.

Im Kopfbereich einer Webseite müssen folgende Dateien eingesetzt werden:
<!-- Prototype Framework -->
<script type="text/javascript" src="pfad/prototype.js"></script>
<!-- Effektbibliothek -->
<script type="text/javascript" src="pfad/scriptaculous.js?load=effects"></script>
<!-- Lightbox Skript-->
<script type="text/javascript" src="pfad/lightbox.js"></script>
<!-- CSS Datei -->
<link rel="stylesheet" href="css/lightbox.css" type="text/css" media="screen" />


Der Bildaufruf im Seitenbereich sieht dann so aus:
<a href="/pfad/grosses-bild.jpg" rel="lightbox" title="Testbild">
<img src="/pfad/vorschaubild.jpg" alt="Vorschaubild" width="150" height="200" />
</a>

Anhand des rel Attributes sucht das Skript sich die Bilder im Quelltext heraus und öffnet das größere Bild dann direkt im Fenster. Das title Attribut im Link wird als Titel des Bildes verwendet. Weitere Optionen findet man auf der lightbox Seite.

Die Lightbox2, inklusive aller notwendigen Bibliotheken, kann man hier herunterladen. Man findet im Netz auch noch viele andere ähnliche Scripte wie z.B. thickbox oder greybox. Einfach mal googlen. ;o)