Responsiivinen ja mukautettava kuvagallerialaajennus
Lightgallery.js on hyödyllinen ja avoimen lähdekoodin kuvien kokoa ja muokkaaja.
Lightgallery.js on hyödyllinen ja helposti muokattavissa oleva laajennus, joka sopii täydellisesti projekteihin, jotka vaativat paljon ominaisuuksia videoiden ja kuvien lataamiseen ja näyttämiseen verkkosivustoilla. Täysin JavaScriptillä ja CSS:llä kehitetty se on täysin varusteltu lightbox-galleria, joka tarjoaa kehittäjille monia vaihtoehtoja.
Avoimen lähdekoodin vapaasti käytettävä laajennus Lightgallery.js on hyödyllinen, kun tarvitset muita lisävaihtoehtoja kuin koon muuttaminen ja kuva- ja videosisällön lataaminen verkkosivustollesi gallerian muodossa. Se myös tallentaa kuvien ja videoiden selainhistorian diaan ja tarjoaa yksilöllisen URL-osoitteen jokaiselle galleriakuvalle. Se ei ole vain nopea, vaan myös kevyt, modulaarinen, reagoiva lightbox-gallerian luoja, joka ei estä muistin suorituskykyä.
LightGalleryn käytön aloittaminen
Suositeltu tapa asentaa LightGallery NPM:n kautta. Käytä seuraavaa komentoa asentaaksesi se.
Asenna LightGallery NPM:n kautta
npm install lightgallery.js
Ilmainen JavaScript API kuvankäsittelyyn
Lightgallery.js sisältää monia sisäänrakennettuja moduuleja, kuten pikkukuvien luomista, koko näyttöä, lähentämistä ja loitontaa jne., jotka voidaan hylätä, jos et tarvitse niitä. Voit myös lisätä omia moduuleja projektisi vaatimusten mukaan. Toisin kuin JavaScript-menetelmä kuvien ja videoiden koon muuttamiseen, Lightgallery.js käyttää vain CSS-menetelmää responsiiviseen koonmuutokseen, mikä tekee siitä huomattavasti nopeamman ja joustavamman. Päivittämällä galleriasi SASS-muuttujat voit helposti mukauttaa laajennuksen tarpeidesi mukaan.
Luo pikkukuvia ilmaisen JavaScript API:n kautta
Mitä tulee pikkukuviin, Lightgallery.js antaa sinun ottaa käyttöön animoidut pikkukuvat, kuten YouTube, jotta saat nykyaikaisemman tunnelman. Animoidut pikkukuvat voidaan aktivoida myös YouTube- tai Vimeo-galleriassasi. Lightgallery.js sisältää yli 20 lisäosan sisäänrakennettua animaatiota, joiden avulla voidaan luoda kauniita gallerioita.
Luo staattinen pikkukuvagalleria JavaScriptin avulla
lightGallery(document.getElementById('static-thumbnails'), {
animateThumb: false,
zoomFromOrigin: false,
allowMediaOverlap: true,
toggleThumb: true,
});
Mukauta pikkukuvagallerian luomista JavaScriptin avulla
lightGallery(document.getElementById('customize-thumbnails-gallery'), {
// Add a custom class to apply style only for the particular gallery
addClass: 'lg-custom-thumbnails',
// Remove the starting animations.
// This can be done by overriding CSS as well
appendThumbnailsTo: '.lg-outer',
animateThumb: false,
allowMediaOverlap: true,
});