15 Lightbox-Bibliotheken für die mobile Reaktionsfähigkeit

Lightbox ist eine beliebte Möglichkeit, Bilder im Web zu überlagern . Wenn Sie auf ein Bild klicken, wird die Lightbox mit einer Art von Animation angezeigt und der Hintergrund wird abgedunkelt, sodass Sie sich auf das Bild selbst konzentrieren können. Das Bild ist auch größer im Maßstab. Die beliebtesten Lightbox-JavaScript-Bibliotheken, die wir seit Jahren kennen, ermöglichen es Ihnen, dies auf dem Desktop zu tun, aber nicht so sehr auf mobilen Plattformen.

Dies zu vernachlässigen und die Notwendigkeit der Reaktionsfähigkeit ist heutzutage keine gute Idee, weshalb diese Sammlung von 15 reaktionsfähigen Lightbox-Bibliotheken ausgecheckt werden muss.

Mehr über Hongkiat:

• Einfaches Erstellen von Modal Window mit HTML5 Dialog
• Top 10 kostenlose Responsive Bildergalerien / Diashows
• Erstellen, Kontrollieren und Anpassen eines besseren Modal-Fensters für Ihre Website mit Vex
• jQuery Bildergalerien & Sliders - Best Of

FotoSwipe

PhotoSwipe ist mit Abstand mein Lieblings-Plugin. Es ist leicht, berührungsaktiv und vor allem modular, was es mir erlaubt, ein paar Teile zu entfernen, die nicht benötigt werden. Es läuft gut in mobilen Browsern. Sie können wie in einer nativen App mit Ihren Fingern durch Bilder blättern, und der Übergang verläuft sehr flüssig.

• Abhängigkeit : Keine
• Browser-Unterstützung : IE8 +, Chrome, Firefox, Safari, Opera und ein paar mobile Browser.
• Lizenz : MIT-Lizenz

MagnificPopup

MagnificPopup ist ein weiteres Lightbox-Plugin, entwickelt von derselben Person, die uns PhotoSwipe, Dmitry Semenov, gegeben hat. Es kommt in Form eines jQuery / Zepto-Plugins und bringt auch Funktionen mit, die in PhotoSwipe fehlen, wie die Unterstützung von Video-, Map- und Ajax-Inhalten. Dies ist eine großartige Alternative für diejenigen, die mehr Funktionen zur Hand haben möchten.

• Abhängigkeit : jQuery 1.9.1+ oder Zepto.js
• Browser-Unterstützung : IE7 (teilweise), IE8 +, Chrome, Firefox, Safari und Opera.
• Lizenz : MIT-Lizenz

SwipeBox

Swipebox ist ein jQuery-Plugin mit Touch-Gesten-Unterstützung für mobile Plattform. Es unterstützt auch Videos von Youtube und Vimeo neben Bildern. Swipebox ist auch einfach zu implementieren und hat eine Handvoll Optionen, um sein Verhalten anzupassen. Ich denke Swipebox ist ein großartiges Lightbox Plugin für JavaScript Noobs.

• Abhängigkeit : jQuery
• Browser-Unterstützung : IE9 +, Chrome, Safari, Firefox, Opera, IOS4 +, Android und Windows Phone.
• Lizenz : Nicht definiert

iLightbox

iLighbox ist ein jQuery Lightbox-Plug-in mit einer breiten Palette von Medien-Typen: einschließlich Videos, Flash / SWF, Ajax-Inhalten, iFrame und Karten. Dieses Plugin fügt auch Social-Media-Buttons auf den Medien hinzu, so dass Ihre Nutzer es auf Facebook, Twitter oder Reddit teilen können. Sehen Sie sich auch den erweiterten Bereich an, um zu sehen, wie iLightbox in verschiedenen Szenarien angewendet werden kann.

• Abhängigkeit : jQuery
• Browser-Unterstützung : IE7 +, Chrome, Firefox, Safari und Opera
• Lizenz : Nicht definiert

Lightbox für Bootstrap

Lightbox ist eines der grell fehlenden Teile von Bootstrap. Dieses Plugin behebt das. Wenn Sie Bootstrap verwenden, empfehle ich dringend, diese Bibliothek zu verwenden. Das Plugin ist gut in die Code-Basis von Bootstrap integriert.

• Abhängigkeit : jQuery und Bootstrap Modal
• Browser-Unterstützung : IE8 +, Chrome, Firefox, Safari und Opera
• Lizenz : GNU-Lizenz

Nivo Leuchtmittel

Nivo Lightbox ist ein flexibles Lightbox-Plugin. Mehrere Optionen sind enthalten, um das Erscheinungsbild so zu ändern, wie Sie es gerne hätten, z. B. das Thema, den Übergangseffekt und die Navigation.

• Abhängigkeit : jQuery
• Browser-Unterstützung : IE9 +, Chrome, Firefox, Safari und Opera
• Lizenz : MIT-Lizenz

ImageLightbox

ImageLightbox ist ein Lightbox-Plugin ohne Bloat. Es ist speziell für Bild daher der Name angegeben - kein Video oder andere Medientypen unterstützt. Es erfordert auch kein zusätzliches HTML-Markup; das Element ist ausreichend. Das Plugin funktioniert einfach.

• Abhängigkeit : jQuery
• Browser-Unterstützung : IE9 +, Chrome, Firefox, Safari und Opera
• Lizenz : Nicht definiert

Mini-Leuchtkasten

Ein weiteres Lightbox-Plugin mit keinem der Bloat. Die Bibliothek ist nur 2kb groß und funktioniert nur mit Bildern. Es ist das perfekte Plugin, wenn Sie nur für den neuesten Browser festlegen und andere Medientypen wie Videos nicht überlagern müssen.

• Abhängigkeit : Keine
• Browser-Unterstützung : IE10 +, Chrome, Firefox, Safari und Opera
• Lizenz : MIT-Lizenz

Lichtgehäuse

Lightcase ist ein schönes Lightbox-Plugin. Es kommt mit mehreren Animationen, die Benutzerinteraktion zum Leben erweckt, wie Fade, elastisches Zoom und Scrollen. Darüber hinaus unterstützt es auch verschiedene Arten von Medien einschließlich Youtube Embed, HTML-Videos, SWF und Eingabeformulare. Das Plugin behandelt auch richtig Medien können nicht erreicht oder gefunden werden Fehler

• Abhängigkeit : jQuery
• Browser-Unterstützung : IE9 +, Chrome, Firefox, Safari und Opera
• Lizenz : GPL-Lizenz

Yalb

Yalb steht für Yet Another Lightbox - ist es aber nicht. Yalb enthält eine Handvoll APIs einschließlich benutzerdefinierter Ereignisse, mit denen Sie Lightbox-Zustände erkennen können, z. B. wann es open und wann es in der close . Yalb kommt in zwei Versionen, Vanilla JavaScript und jQuery Plugin.

• Abhängigkeit : Keine
• Browser-Unterstützung : IE9 +, Chrome, Firefox, Safari und Opera
• Lizenz : MIT-Lizenz

Federleicht

Das 6kb Featherlight ist ein blankes Plugin für clevere Entwickler und enthält nur das Nötigste. Wenn Sie zum Beispiel den Leuchtkasten in einer Galerie gruppieren möchten, können Sie die Galerieerweiterung hinzufügen. Sie können auch eine eigene Erweiterung für dieses Plugin entwickeln, die Ihren Projektanforderungen entspricht.

• Abhängigkeit : jQuery
• Browser-Unterstützung : IE8 +, Chrome, Firefox, Safari und Opera
• Lizenz : MIT-Lizenz

Lichtschicht

LightLayer ist ein einfach zu bedienendes Lightbox-Plugin. Es hat eine Handvoll Optionen, benutzerdefinierte JavaScript-Methoden und benutzerdefinierte Ereignisse. Das Plugin funktioniert mit Bildern, Videos, Karten und externen Inhalten. Was können wir noch fragen?

• Abhängigkeit : jQuery
• Browser-Unterstützung : IE9 +, Chrome, Firefox, Safari und Opera
• Lizenz : MIT-Lizenz

LightGallery

LightGallery, ein weiteres Lightbox-Plugin mit vielen zusätzlichen Funktionen. Es enthält mehr als 20 Optionen, um die kleinsten Details des Leuchtkastens zu personalisieren.

• Abhängigkeit : jQuery
• Browser-Unterstützung : IE7 +, Chrome, Firefox, Safari, Opera, iOS, Android und Windows Phone
• Lizenz : MIT-Lizenz

FluidBox

Fluidbox ist ein Lightbox-Plugin für Bilder, das von Medium inspiriert ist. Es funktioniert mit Bildern unter verschiedenen Bedingungen, einschließlich schwebendem Bild, Bild mit absolute Position, Bildern mit Rahmen und Füllung und Galerien. Schau dir an, wie es gebaut wurde. Wenn Sie ein WordPress-Plugin benötigen, gibt es eines.

• Abhängigkeit : jQuery
• Browser-Unterstützung : IE9 +, Chrome, Firefox, Safari, Opera
• Lizenz : MIT-Lizenz

StreifenJS

StripJS ist ein einzigartiges Lightbox-Plugin. Anstatt das Bild zu überlagern, verschiebt das Plugin stattdessen die Bilder von der Seite, so dass es nicht den gesamten Inhalt blockiert. StripJS unterstützt sowohl Bild als auch Video.

• Abhängigkeit : jQuery
• Browser-Unterstützung : IE7 +, Chrome, Firefox, Safari, Opera, iOS 5+ und Android 3+
• Lizenz : Creative Commons BY-NC-ND 3.0-Lizenz

So konfigurieren Sie Ihr DNS für schnellere Internetgeschwindigkeit

Kürzlich habe ich meinen Internetdienstanbieter gewechselt und bemerkte plötzlich langsamere Browsing- und Serververbindungsfehler, obwohl meine Internetgeschwindigkeit in Ordnung war. Ich fand heraus, dass es etwas mit meinem DNS-Server zu tun hatte, also wechselte ich zu einem besseren DNS-Server, basierend auf meinem Standort .

(Tech- und Design-Tipps)

Generieren Sie WordPress Code Snippets "Magisch" mit WP Hasty

Umgang mit WP-Code-Schnipsel kann ein echter Schmerz sein. Von benutzerdefinierten Taxonomien bis zu WP_Query-Schleifen kopieren Entwickler immer Schnipsel zwischen Projekten .Mit der WP Hasty Web App können Sie Zeit und Ärger sparen, indem Sie Snippets mit einem Mausklick automatisch generieren . Diese kostenlose Web-App bietet acht verschiedene Code-Generatoren für gängige WordPress-Snippets (mit vielen weiteren auf dem Weg!)Je

(Tech- und Design-Tipps)