Создайте адаптивный и красивый лайтбокс на всю страницу с BaguetteBox.js
Есть десятки плагинов лайтбоксов, и все они отлично подходят по разным причинам. Некоторые лучше работают на сайтах портфолио, другие лучше всего подходят для адаптивных макетов.
Искусственный интеллект поможет тебе заработать!
Но один из моих любимых новых плагинов – baguetteBox.js, созданный разработчиком JavaScript Marek Grzybek.
Программы для Windows, мобильные приложения, игры - ВСЁ БЕСПЛАТНО, в нашем закрытом телеграмм канале - Подписывайтесь:)
Конечно, этот плагин полностью бесплатен для использования и с открытым исходным кодом на GitHub если вы хотите копаться в коде вручную.
Библиотека не имеет каких-либо зависимостей, поэтому вы можете запустить ее без jQuery, Zepto или чего-либо еще. Это чистая библиотека JavaScript с очень простой настройкой.
Читайте также: 25 бесплатных плагинов для слайдшоу для WordPress – Best of
Он предназначен для идеальной работы на мобильных устройствах, поэтому он может поддерживать прокрутки и нажатия, а также поведение по умолчанию на настольных компьютерах и ноутбуках. Это одна из немногих полноэкранных галерей, которые поддерживают мобильное взаимодействие наряду с полным модальным эффектом.
Проверьте демонстрационная страница увидеть это в действии. Он имеет полнофункциональную галерею и одну строку кода, необходимую для его работы:
baguetteBox.run ( ‘baguetteBoxOne’);
Таким образом, это предназначается для элемента контейнера с классом .baguetteBoxOne, и вся галерея работает на этом.
Вы можете установить пользовательские параметры, если вы хотите такие вещи, как заголовки, стили кнопок, функции предварительной загрузки и методы обратного вызова для событий onclick / onchange. Все эти варианты хорошо документированы на GitHub если вы хотите погрузиться в.
Но это действительно не займет много времени, чтобы выйти за рамки элемента контейнера и некоторых основных элементов изображения.
Вы имеете полный контроль над анимацией, размерами изображений, эффектами смахивания и содержимым галереи, такими как заголовки / подписи. Это требует JavaScript, поэтому у него нет чистой CSS-альтернативы модальному. Но, поскольку большинство браузеров поддерживают JavaScript, это не должно быть проблемой.
Чтобы узнать больше, посетите главная страница baguetteBox.js и вы также можете поделиться своими мыслями с создателем в Twitter @feimosi,
Читайте также: Полноэкранные слайд-шоу Lightbox с Lightgallery.js
<script async src="https://triu.ru/wp-content/litespeed/localres/aHR0cHM6Ly9wbGF0Zm9ybS50d2l0dGVyLmNvbS93aWRnZXRzLmpz" charset="utf-8"></script>
Программы для Windows, мобильные приложения, игры - ВСЁ БЕСПЛАТНО, в нашем закрытом телеграмм канале - Подписывайтесь:)