Responsivt och anpassningsbart plugin för bildgalleri
Lightgallery.js är en användbar och öppen källkod för bildförändring och anpassare.
Lightgallery.js är ett användbart och mycket anpassningsbart plugin som är perfekt för projekt som kräver många funktioner när det kommer till att ladda och visa videor och bilder på webbplatser. Utvecklat helt i JavaScript och CSS, det är ett fullfjädrat ljusbordsgalleri som erbjuder utvecklare många alternativ.
Som en öppen källkod, gratis att använda plugin Lightgallery.js kommer väl till pass när du behöver dessa extra alternativ än att ändra storlek och ladda upp bild- och videotillgångar till din webbplats i form av ett galleri. Den lagrar också webbläsarhistoriken för bilderna och videorna i en bild och ger en unik URL för varje galleribild. Det är inte bara snabbt utan också en lätt, modulär, lyhörd ljuslådegalleriskapare som inte hindrar minnesprestanda.
Komma igång med LightGallery
Det rekommenderade sättet att installera LightGallery via NPM. Använd följande kommando för att installera det.
Installera LightGallery via NPM
npm install lightgallery.js
Gratis JavaScript API för bildmanipulering
Lightgallery.js kommer med många inbyggda moduler som att skapa miniatyrer, helskärm, zooma in och ut, etc. som kan kasseras om du inte behöver dem. Du kan också lägga till dina egna moduler beroende på kraven för ditt projekt. Till skillnad från JavaScript-metoden för att ändra storlek på bilder och videor, använder Lightgallery.js enbart CSS-metoden för responsiv storleksändring, vilket gör det betydligt snabbare och mer flexibelt. Genom att helt enkelt uppdatera SASS-variablerna i ditt galleri kan du enkelt anpassa plugin-programmet för att passa dina behov.
Skapa miniatyrer via gratis JavaScript API
När det kommer till miniatyrer låter Lightgallery.js dig aktivera animerade miniatyrer precis som YouTube för att ge en mer modern känsla. Animerade miniatyrer kan också aktiveras för ditt YouTube- eller Vimeo-galleri. Lightgallery.js kommer med mer än 20 animationer inbyggda i plugin som kan användas för att skapa vackra gallerier.
Skapa statiskt miniatyrgalleri via JavaScript
lightGallery(document.getElementById('static-thumbnails'), {
animateThumb: false,
zoomFromOrigin: false,
allowMediaOverlap: true,
toggleThumb: true,
});
Anpassa skapande av miniatyrbilder med JavaScript
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,
});