15 Lightbox-bibliotheken voor mobiel reactievermogen

Lightbox is een populaire manier om overlay afbeeldingen op het web. Wanneer u op een afbeelding klikt, verschijnt de Lightbox met een of andere vorm van animatie en dimt de achtergrond zodat u zich op de afbeelding zelf richt. Het beeld is ook groter in schaal. De meeste populaire JavaScript-bibliotheken van Lightbox die we al jaren kennen, laten je dit goed doen op desktops, maar niet zozeer op mobiele platforms.

Dit verwaarlozen en de behoefte aan responsiviteit is tegenwoordig geen goed idee, daarom moet deze verzameling van 15 responsieve Lightbox-bibliotheken worden uitgecheckt.

Meer over Hongkiat:

• Gemakkelijk modaalvenster maken met HTML5-dialoogvenster
• Top 10 gratis responsgalerijen / diavoorstellingen
• Creëer, bedien & pas beter modaal venster aan voor uw site met behulp van Vex
• jQuery Image Galleries & Sliders - Best Of

PhotoSwipe

PhotoSwipe is verreweg mijn favoriete ligthbox-plug-in. Het is licht, aanraakbaar en vooral modulair, waardoor ik een paar onderdelen kan weggooien die niet nodig zijn. Het werkt goed in mobiele browsers. Je kunt met je vingers door afbeeldingen schieten zoals je in een native app zou doen, en de overgang verloopt echt soepel.

• Afhankelijkheid: Geen
• Browserondersteuning: IE8 +, Chrome, Firefox, Safari, Opera en een aantal mobiele browsers.
• Licentie: MIT-licentie

MagnificPopup

MagnificPopup is een andere lightbox-plug-in, ontwikkeld door dezelfde persoon die ons PhotoSwipe, Dmitry Semenov gaf. Het komt in de vorm van een jQuery / Zepto-plug-in, en brengt ook mogelijkheden die ontbreken in PhotoSwipe, zoals ondersteuning voor Video, Map en Ajax-inhoud. Dit is een geweldig alternatief voor diegenen die liever meer functies bij de hand hebben.

• Afhankelijkheid: jQuery 1.9.1+ of Zepto.js
• Browserondersteuning: IE7 (gedeeltelijk), IE8 +, Chrome, Firefox, Safari en Opera.
• Licentie: MIT-licentie

SwipeBox

Swipebox is een jQuery-plug-in met ondersteuning voor aanraakbewegingen voor mobiel platform. Het ondersteunt ook video's van YouTube en Vimeo, afgezien van afbeeldingen. Swipebox is ook ronduit eenvoudig te implementeren en heeft een handvol opties om zijn gedrag aan te passen. Ik denk dat Swipebox een geweldige lightbox-plug-in is voor JavaScript-noobs.

• Afhankelijkheid: jQuery
• Browserondersteuning: IE9 +, Chrome, Safari, Firefox, Opera, IOS4 +, Android en Windows Phone.
• Licentie: onbepaald

iLightbox

iLighbox is een jQuery-lightbox-plug-in met een breed scala aan ondersteuning voor mediatypen: inclusief video's, Flash / SWF, Ajax-inhoud, iframe en kaarten. Deze plug-in voegt ook socialemediaknoppen toe aan de media, zodat uw gebruikers deze kunnen delen met Facebook, Twitter of Reddit. Bekijk ook het geavanceerde gedeelte om te zien hoe iLightbox in verschillende scenario's kan worden toegepast.

• Afhankelijkheid: jQuery
• Browserondersteuning: IE7 +, Chrome, Firefox, Safari en Opera
• Licentie: onbepaald

Lightbox voor Bootstrap

Lichtbak is een van de schokkend ontbrekende stukjes van Bootstrap. Deze plug-in repareert dat. Als u Bootstrap gebruikt, raad ik u ten zeerste aan om deze bibliotheek te gebruiken. De plug-in is goed geïntegreerd met Bootstrap's codebasis.

• Afhankelijkheid: jQuery en Bootstrap Modal
• Browserondersteuning: IE8 +, Chrome, Firefox, Safari en Opera
• Licentie: GNU-licentie

Nivo Lightbox

Nivo Lightbox is een flexibele lightbox-plug-in. Er zijn verschillende opties toegevoegd om het uiterlijk naar eigen inzicht te wijzigen, zoals het wijzigen van het thema, het overgangseffect en het wisselen van de navigatie.

• Afhankelijkheid: jQuery
• Browserondersteuning: IE9 +, Chrome, Firefox, Safari en Opera
• Licentie: MIT-licentie

ImageLightbox

ImageLightbox is een lightbox-plug-in zonder de bloat. Het is speciaal gebouwd voor beeld vandaar de gegeven naam - geen video of ander mediatype ondersteund. Het vereist ook geen externe HTML-opmaak; de element is voldoende. De plugin werkt gewoon.

• Afhankelijkheid: jQuery
• Browserondersteuning: IE9 +, Chrome, Firefox, Safari en Opera
• Licentie: onbepaald

Mini Lightbox

Nog een lightbox-plug-in met geen van de opgeblazenheid. De bibliotheek is slechts 2 kb en werkt alleen met afbeeldingen. Het is de perfecte plug-in als u alleen de nieuwste browser aanwijst en andere mediatypen zoals video's niet hoeft te overlappen.

• Afhankelijkheid: Geen
• Browserondersteuning: IE10 +, Chrome, Firefox, Safari en Opera
• Licentie: MIT-licentie

LightCase

Lightcase is een mooie lightbox-plug-in. Het wordt geleverd met verschillende animaties die de gebruikersinteractie tot leven brengen, zoals vervagen, elastisch zoomen en scrollen. Verder ondersteunt het ook verschillende soorten media, inclusief embedden van YouTube, HTML-video's, SWF en invoerformulieren. De plug-in kan ook goed omgaan met media kan niet worden bereikt of gevonden fouten

• Afhankelijkheid: jQuery
• Browserondersteuning: IE9 +, Chrome, Firefox, Safari en Opera
• Licentie: GPL-licentie

Yalb

Yalb staat voor Yet Another Lightbox - maar dat is het niet. Yalb wordt geleverd met een handvol API's inclusief aangepaste gebeurtenissen waarmee u lightbox-staten kunt identificeren, zoals wanneer Open en wanneer het is dichtbij. Yalb komt in twee versies, Vanilla JavaScript en jQuery plugin.

• Afhankelijkheid: Geen
• Browserondersteuning: IE9 +, Chrome, Firefox, Safari en Opera
• Licentie: MIT-licentie

Veer licht

De 6kb Veer licht is een kale plug-in voor een slimme ontwikkelaar en bevat alleen de essentiële zaken. Als u bijvoorbeeld de lightbox van een afbeelding in een galerij wilt groeperen, kunt u de galerijextensie opnemen. U kunt ook uw eigen extensie voor deze plug-in ontwikkelen om in uw projectbehoeften te passen.

• Afhankelijkheid: jQuery
• Browserondersteuning: IE8 +, Chrome, Firefox, Safari en Opera
• Licentie: MIT-licentie

LightLayer

LightLayer is een eenvoudig te gebruiken lightbox-plug-in. Het heeft een handvol opties, aangepaste JavaScript-methoden en aangepaste evenementen. de plug-in werkt met afbeeldingen, video's, kaarten en externe inhoud. Wat kunnen we nog meer vragen?.

• Afhankelijkheid: jQuery
• Browserondersteuning: IE9 +, Chrome, Firefox, Safari en Opera
• Licentie: MIT-licentie

LightGallery

LightGallery, een andere lightbox-plug-in met veel functies toegevoegd. Het wordt geleverd met meer dan 20 opties om de kleinste details van de lightbox aan te passen.

• Afhankelijkheid: jQuery
• Browserondersteuning: IE7 +, Chrome, Firefox, Safari, Opera, iOS, Android en Windows Phone
• Licentie: MIT-licentie

FluidBox

FluidBox is een image lightbox-plug-in die is geïnspireerd op Medium. Het werkt met afbeeldingen onder verschillende omstandigheden, inclusief zwevend beeld, afbeelding met absoluut positie, afbeeldingen met rand en opvulling en galerijen. Bekijk hoe het is gebouwd. Als je een WordPress-plug-in nodig hebt, is er een.

• Afhankelijkheid: jQuery
• Browserondersteuning: IE9 +, Chrome, Firefox, Safari, Opera
• Licentie: MIT-licentie

StripJS

StripJS is een unieke lightbox-plug-in. In plaats van de afbeelding te overlappen, schuift de plug-in de afbeeldingen vanaf de zijkant naar binnen, zodat deze de hele inhoud niet blokkeert. StripJS ondersteunt zowel beeld als video.

• Afhankelijkheid: jQuery
• Browserondersteuning: IE7 +, Chrome, Firefox, Safari, Opera, iOS 5+ en Android 3+
• Licentie: Creative Commons BY-NC-ND 3.0-licentie