Responsywna i konfigurowalna wtyczka galerii obrazów
Lightgallery.js jest użytecznym narzędziem do zmiany rozmiaru i dostosowywania obrazów o otwartym kodzie źródłowym.
Lightgallery.js to przydatna i wysoce konfigurowalna wtyczka, która idealnie nadaje się do projektów wymagających wielu funkcji, jeśli chodzi o ładowanie i wyświetlanie filmów i obrazów na stronach internetowych. Opracowana całkowicie w JavaScript i CSS, jest w pełni funkcjonalną galerią lightbox, która oferuje programistom wiele opcji.
Jako open source, bezpłatna wtyczka Lightgallery.js przydaje się, gdy potrzebujesz tych dodatkowych opcji innych niż zmiana rozmiaru i przesyłanie zasobów graficznych i wideo do swojej witryny w formie galerii. Przechowuje również historię przeglądania obrazów i filmów w slajdzie i zapewnia unikalny adres URL dla każdego obrazu w galerii. Jest nie tylko szybki, ale także lekki, modułowy, responsywny kreator galerii lightbox, który nie wpływa negatywnie na wydajność pamięci.
Pierwsze kroki z LightGallery
Zalecany sposób instalacji LightGallery przez NPM. Użyj następującego polecenia, aby go zainstalować.
Zainstaluj LightGallery przez NPM
npm install lightgallery.js
Darmowy JavaScript API do manipulacji obrazami
Lightgallery.js zawiera wiele wbudowanych modułów, takich jak tworzenie miniatur, pełny ekran, powiększanie i pomniejszanie itp., które można odrzucić, jeśli ich nie potrzebujesz. Możesz również dodawać własne moduły w zależności od wymagań Twojego projektu. W przeciwieństwie do metody JavaScript zmiany rozmiaru obrazów i filmów, Lightgallery.js wykorzystuje podejście CSS tylko do responsywnej zmiany rozmiaru, dzięki czemu jest znacznie szybsze i bardziej elastyczne. Po prostu aktualizując zmienne SASS swojej galerii, możesz łatwo dostosować wtyczkę do swoich potrzeb.
Twórz miniatury za pomocą bezpłatnego interfejsu API JavaScript
Jeśli chodzi o miniatury, Lightgallery.js pozwala włączyć animowane miniatury, podobnie jak YouTube, aby nadać bardziej nowoczesny wygląd. Animowane miniatury można również aktywować w swojej galerii YouTube lub Vimeo. Lightgallery.js zawiera ponad 20 animacji wbudowanych we wtyczkę, której można używać do tworzenia pięknych galerii.
Utwórz galerię statycznych miniatur za pomocą JavaScript
lightGallery(document.getElementById('static-thumbnails'), {
animateThumb: false,
zoomFromOrigin: false,
allowMediaOverlap: true,
toggleThumb: true,
});
Dostosuj tworzenie galerii miniatur za pomocą 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,
});