Fullscreen Lightbox Slideshows med Lightgallery.js
Enhver stor blog eller portefølje hjemmeside kan drage fordel af en modal lightbox diasshow. Dette kan være godt for fremvisning relaterede billeder eller lade besøgende gennemse en portefølje af arbejde (design, kunst, fotografi).
Med lightgallery.js, du bare installer biblioteket og lad det løbe. Du kan sætte det op med et hvilket som helst antal fotos og hvert dias optager hele skærmen.
Jeg foretrækker stort set dette plugin over andre lysbilledshow, der kun tager en del af skærmen. Med lightgallery.js, alt fokus går ind på diasshowet og det første synlige billede.
I bunden af hvert dias kan du finde en lille beskrivelse med links eller uanset hvilken tekst du ønsker.
I øverste højre hjørne ser du en række knapper til udvidede funktioner. I orden går de sådan:
- Afspil diasshow
- Zoom ind / ud
- Browser fuldskærm
- Social deling
- Billed download
- Luk lysbilledshow
Du kan vælge og vælge hvilken af disse knapper, du vil vise med redigering af indstillingerne når du kalder plugin'et.
Faktisk er jeg blæst væk med hvor meget detaljer gik ind i dokumentationen. Det har detaljer for muligheder og tilbagekaldelsesmetoder. Men du vil også finde information til brugerdefinerede dataattributter, Sass variabler, og endda a plugin API at bygge moduler på lightgallery.
Åh, og jeg nævner det helt mobilvenlig? Du kan skubbe fotos gennem galleriet med din finger eller endda med en mus.
Det er det perfekte valg for en designer eller fotograf, der ønsker en strålende metode til at vise deres portefølje på deres websted.
Du kan endda indlejre iframes eller videoer fra websteder som YouTube eller Vimeo. Dette er virkelig det bedste lightbox galleri plugin, der giver den bedst mulige brugeroplevelse.
Dette bibliotek er fri for alle afhængigheder og det kører på rent JavaScript. Men det spiller godt med store biblioteker som jQuery eller Bootstrap også.
Hvis du foretrækker dette som et jQuery-plugin der er en lightgallery.js plugin portet til jQuery brugere. Du kan se en fuld demo på den demoside eller tjek den pen nedenfor. Og hvis du har brug for kildekode hoved over til GitHub repo og tag en kopi for dig selv.
