Всем привет! Если вы ищите легковесную, простую javascript галерею с поддержкой свайпов и без зависимостей, то ваш выбор – PhotoSwipe .
Всем привет! Если вы ищите легковесную, простую javascript галерею с поддержкой свайпов и без зависимостей, то ваш выбор – PhotoSwipe.
Как уже было сказано, библиотека PhotoSwipe легковесная, быстрая, поддерживает свайпы и не имеет зависимостей.
Поддерживаются все базовые жесты, такие как: свайп влево/вправо, чтобы перелистнуть картинку, увеличение/уменьшение изображения, закрытие галереи сведением пальцев, одиночное нажатие, чтобы показать/скрыть управление, и другие.
Также библиотека сохраняет просмотренные изображения в историю браузера и добавляет к ним уникальный код, чтобы можно было делиться картинками с друзьями, быстро возвращаться к просмотренным и так далее.
Показываются мини-картинки в низком разрешении, а когда пользователь кликает по ним, открываются изображения в истинном качестве. Присутствует индикатор загрузки, а также анимации увеличения картинки.
Также есть классная вещь: картинки показываются сразу пользователю в низком качестве, а потом постепенно подгружаются, если у вас медленный интернет.
Библиотека позволяет определить совершенно любую HTML-разметку, следовательно, вы можете структурировать данные, как вам нужно.
Конечно, это далеко не все. Есть также поддержка HTML5 функций, управление с клавиатуры и много чего другого. Но это вы можете почитать сами на официальном сайте.
Установка не должна создать вам проблем:
- Подключите необходимые файлы стилей и скрипт
- Добавьте .pswp элемент в DOM
- Проведите инициализацию
Вот и все! Вы можете даже сами собрать галерею, как хотите, и добавить туда только нужный вам функционал. Как все это делать вы можете почитать в инструкции. Ну и, конечно, не забудьте посмотреть демонстрацию.
А на этом сегодня все. Спасибо за внимание!
