Lightgallery - уникальная адаптивная Touch галерея на jQeury
|
1 2 |
<link rel='stylesheet prefetch' href='/css/lightgallery.min.css'> <link rel="stylesheet" type="text/css" href="/css/lg-transitions.css"> |
|
1 2 3 4 5 6 7 8 |
<script src='/js/jquery.mousewheel.min.js'></script> <script src='/js/lightgallery.min.js'></script> <script src='/js/lg-thumbnail.min.js'></script> <script src='/js/lg-fullscreen.min.js'></script> <script src='/js/lg-video.min.js'></script> <script src='/js/lg-autoplay.min.js'></script> <script src='/js/lg-pager.min.js'></script> <script src='/js/lg-zoom.min.js'></script> |
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 |
<div id="lightgallery"> <a href="ССЫЛКА_НА_КАРТИНКУ"> <img src="ССЫЛКА_НА_КАРТИНКУ_ПРЕВЬЮ" /> </a> <a href="ССЫЛКА_НА_КАРТИНКУ"> <img src="ССЫЛКА_НА_КАРТИНКУ_ПРЕВЬЮ" /> </a> <a href="ССЫЛКА_НА_РОЛИК_ЮТЮБ"> Я - ролик ютюб </a> <a href="ССЫЛКА_НА_САЙТ"> Я - айфрейм </a> </div> <script> $("#lightgallery").lightGallery({ mode: 'lg-slide-skew-only-y', thumbnail: false }); </script> |
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 |
mode: 'lg-slide', // Тип анимации при переходах - 'lg-slide''lg-fade''lg-zoom-in''lg-zoom-in-big''lg-zoom-out''lg-zoom-out-big''lg-zoom-out-in''lg-zoom-in-out''lg-soft-zoom''lg-scale-up''lg-slide-circular''lg-slide-circular-vertical''lg-slide-vertical''lg-slide-vertical-growth''lg-slide-skew-only''lg-slide-skew-only-rev''lg-slide-skew-only-y''lg-slide-skew-only-y-rev''lg-slide-skew''lg-slide-skew-rev''lg-slide-skew-cross''lg-slide-skew-cross-rev''lg-slide-skew-ver''lg-slide-skew-ver-rev''lg-slide-skew-ver-cross''lg-slide-skew-ver-cross-rev''lg-lollipop''lg-lollipop-rev''lg-rotate''lg-rotate-rev''lg-tube' cssEasing: 'ease', // Какой тип анимации CSS использовать easing: 'linear', // Какой тип jQuery анимации использовать speed: 600, // Скорость анимации height: '100%', // Высота галереи width: '100%', // Ширина галереи addClass: '', // Добавить новый класс для галереи startClass: 'lg-start-zoom', // С какого класса анимации начинать показ backdropDuration: 150, // Скорость перехода на задний план hideBarsDelay: 6000, // Через сколько скрывать панель навигации useLeft: false, // Использовать ли выравнивание по левому краю closable: true, // Закрывать ли галерею при клике по заглушке loop: true, // Бесконечная прокрутка элементов галереи escKey: true, // Закрывать ли галерею по ESC keyPress: true, // Использовать ли навигацию с клавиатуры controls: true, // Отображать ли стрелочки навигации slideEndAnimatoin: true, // Использовать ли анимацию в конце слайда hideControlOnEnd: false, // Скрывать ли навигацию на первом/последнем слайде mousewheel: true, // Использовать ли колёсико мышки getCaptionFromTitleOrAlt: true, // Брать ли описание с alt и title тегов preload: 1, // Количество предварительно кешируемых слайдов showAfterLoad: true, // Показывать содержимое лишь после полной загрузки index: 0, // Какой по счёту элемент слайдера загружать первым iframeMaxWidth: '100%', // Максимальная ширина айфрейма download: true, // Отображать ли кнопку скачивания counter: true, // Отображать ли количество элементов в слайдере enableDrag: true, // Включить ли возможность перетаскивания enableTouch: true, // Включить ли возможность хватания |
Автор публикации
Я не понял вашего вопроса, но постараюсь на него ответить...
