Skripte für Lightboxen und Galerien gibt es inzwischen eine ganze Menge. Das bekannte jQuery-Lightbox-Plugin hat dabei einer Vielzahl als Vorlage gedient. Webentwickler Stéphane Caron hatte von den bestehenden keine so wirklich gefallen, deshalb hat er seine eigene Variante gebaut: prettyPhoto.
Auch dieses Lightbox-Plugin arbeitet mit dem beliebten jQuery-Framework zusammen und lässt sich einfach integrieren. Neben Titel und Beschreibung für die Bilder besteht auch die Möglichkeit diese sehr simpel als Galerie zusammenzufassen. Eine Funktion die doch sehr sympathisch und nur selten vorzufinden ist. Weiterhin lässt sich die Lightbox über Themes an die jeweiligen Bedürfnisse anpassen. Insgesamt 4 verschiedene Themes werden mitgeliefert.
Bilder die mit der Lightbox angezeigt werden sollen, müssen lediglich mit einem Link zum Vollbild und dem Attribut rel=“prettyPhoto“ versehen werden. Titel und Beschreibungen lassen sich dann über die Attribute alt und title zuweisen. Um von der Galeriefunktion gebrauch machen zu können muss das Relation-Attribut lediglich noch um den Namen der Galerie in eckigen Klammern erweitert werden, also rel=“prettyPhoto[Galerie]“.
Das Plugin steht unter der Creative-Commons Attribution 2.5, kann folglich unter der Bedingung der Namensnennung frei verwendet und weiterentwickelt werden. Selbst für den kommerziellen Gebrauch. Wer das Plugin in WordPress einsetzen möchte, kann bereits auf ein entsprechendes WordPress-Plugin zurückgreifen.
Ebenfalls interessant sind die weiteren jQuery-Plugins des Entwicklers: prettyPopin und prettyComments, ein skalierendes Kommentar-Textfeld und ein Ajax-Popup…
0 Antworten zu „prettyPhoto – Alternative jQuery-Lightbox mit Galerieunterstützung“
— was ist Deine Meinung?
Ich habe das Plugin bei mir auf meiner Seite implementiert, doch leider hat es bei manchen Besuchern deren Webbrowser (ich glaube das war der IE6) komplett zum Absturz gebracht.
So habe ich es wieder deinstallieren müssen. Eine Seite mit einem solchen „Tool“ zu verschönern ist die eine Sache, aber das Besuchern dann nicht mehr auf die Seite können, weil der Browser sich komplett aufhängt, ist die andere Sache.
Also schöne Idee, nur leider noch nicht ausgereift.
Ja, der IE 6 ist tatsächlich nicht ausgereift. Genau wie IE7, IE8, IE9 und alle IE´s, die noch kommen werden…
Wenn alle Benutzer einen ordentlichen Browser verwenden würden, hätten die coder weit weniger Probleme.
Ich finde dieses Plugin einfach genial.
Bisher habe ich für meine Fotogallerieren immer Lightbox verwendet. Aber bei prettyPhoto gefällt mir vor allem, dass der komplette hintere Bereich des Bilds deaktiviert wird.
Einfach nur klasse 🙂
Werde jetzt mal alles umstellen … schaut doch mal ‚rein 🙂
Navi per Tastatur geht jetzt. Mausrad wäre noch schön! 😀
@Johannes mit Javascript
1. Nimm alle Attribute aus dem a-Tag in dem das rel=“lightbox“ gesetzt ist
2. fang den Klick ab und öffne die Galerie (= Einblenden von vordefiniertem HTML- und CSS-Code und Abdunkeln der Seite) mit den ausgelesenen Attributen
3. zusätzliche Funktionen für Animation der Bilder, Navi-Links etc.
Eine genaue Anleitung zu schreiben, würde den Umfang sprengen. Viel Glück!
Hi,
das möchte ich auch können.
Bin (fast blutiger) Anfänger. Wie programmiert man so etwas?
lg
Johannes
Danke für den Tipp, gerade habe ich eine Galerie in so einer Art gesucht :))
lg
Mari
Hinterlässt einen wirklich guten Ersteindruck.
Ist aber teilweise noch buggy, z.B. funktioniert die Navigation mit den Cursortasten nicht korrekt.
Also bleibts vorerst doch die Thickbox.
Müsste noch optimiert werden, funzt nämlich mit Tastaturbedienung nicht.
Hi,
vielen Dank für den Artikel, das kannte ich noch nicht. Werde ich mir aber gleich mal näher anschauen!