Wie evtl. einige schon mitbekommen haben, nutze ich seit der neuen Hackthenet-Version eine Art Lightbox, welche jedoch auf den Namen Thickbox hört und einige tolle Vorteile mit sich bringt.
Zum einen wäre da, das die Thickbox “nur” 31Kb wiegt. Die Thickbox basiert zudem nicht auf den JS-Frameworks Scriptacolous oder Prototype sondern auf dem immer beliebteren jQuery. Da wäre also schon der zweite Vorteil. jQuery bringt viele gute und tolle Effekte mit sich, welche in der 31KB-Variante der Thickbox also bereits integriert wären. Wer eine kleine Kostprobe will, der möge einfach auf das Artikelbild klicken :)
Die Thickbox bietet jedoch noch andere Vorteile:
Zum einen werden Bilder automatisch der Browsergröße angepasst, kommt also jemand mit einer 800×600 Auflösung daher bleibt ihm das Scrollen erspart, das Bild wird automatisch proportional herunter gerechnet. Das ganze wird dann zwar etwas pixelig, jedoch ist diese Methode ja auch nur für die Ausnahme bestimmt.
Ein weiterer Vorteil ist, das die Thickbox nicht nur mit allen möglichen Bildformaten umzugehen weis, nein, jeglicher Browserinhalt kann mit Ihr hervorgehoben werden, sei es ein JPG, PNG oder auch ein PDF. Worauf ich jedoch hinaus will, ist die Möglichkeit von AJAX abrufen, also auch der Nutzung von HTML innerhalb der Thickbox, so ist es z.B. möglich ein schickes Loginformular bei einem Klick einfaden zu lassen, wirklich etwas sehr nützliches und innovatives.
Auch eine Galerieunterstützung (also das Vor und Zurückklicken innerhalb einer Bildershow) ist kein Problem.
Einzig Abstriche beim Effekt muss man evtl. tätigen, so klappt sich die Bühne nicht wie bei der Lightbox auseinander, sondern wird “nur” durch eine schöne Ladeanimation angekündigt und dann eingefadet.
Und noch ein Tpp:
Wer übrigens wirklich nur mal eben ein Bild schön einbinden möchte, dabei die 100KB der Lightbox scheut und die tollen Dinge der Thickbox nicht benötigt, der sollte auf die Slimbox zurückgreifen.
Sie arbeitet mit dem Mootools-Framework und ist Alles in Allem nur 21Kb “fett”. Die Slimbox unterscheidet sich im Effekt und der Anwendung dabei in keinster Weise zur Lightbox 2.0.
Kommentare zum Thema Meine neue Lightbox: Thickbox!:
Nunja, nicht valide da hohe Kompatibilität zu alten Browsern. Der Output an sich ist auch valide, nur einige Hacks im CSS nicht. Die kannst du im Prinzip auch valide machen indem du die Hacks rauslöschst, aber dann sieht es in älteren Browsern eben nicht mehr so fein aus :)
Hallo
Ich probier jetzt schon längeren mit der Thickbox und CakePHP herum. Wie hast du Thickbox integriert. Speziell mein ich jetzt wie du das zielfile aufrufst.
$html->link(‘Show Map’, ‘/map’, array(‘class’ => ‘thickbox’, ‘href’ =>‘map.thtml?KeepThisflÛÛÛ=true&TB_iframe=true&height=400&width=600’));
Ich habe im Verzeichnis views/pages/ das file map.thtml drinnen die mir einen googlemaps iframe aufbaut. Und dorthin würd ich gern die Maps url übergeben sodass ich in der Thickbox -> im Iframe meine map habe. Hast du einen Clue für mich wie ich das ewerkstelligen könnte
Gruß grobald
Eine CSS2.1-valide Version der Thickbox ist die Smoothbox , die, ebenso wie slimbox, auf mootools basiert.
Gruß,
Stephan
oder wer es sehr flexibel will kann auch
jQuerytools
testen
Hallo zusammen,
ich nutze Thickbox 3.1 für ilch “http://www.ilch.de/downloads-show-1307.html” und bin wirklich überrascht wie toll die Thickbox funktioniert. Nun ist mir aber aufgefallen, dass ich keine Vor und Zurück Buttons habe um auch mal bei 10 Bildern hin und her zu klicken. Ist dieses irgendwie auch möglich? Wenn ja, dann wäre Thickbox dank des automatischen anpassen der Browsergröße wirklich perfekt.
Kommentar-Feed für diesen Artikel
Kommentarfunktion für diesen Artikel geschlossen.
Webdeveloper 1.1.3 mit vielen Neuerungen erschienen! Youtube - Jeden Tag ein wenig langsamer
Super teil nutze ich auch, aber sehr selten da nicht Valide.