15 Адаптивних jquery плагінів lightbox

15 Адаптивних jQuery плагінів Lightbox

Багато разів робив огляди різних галерей зображень, зібрав велику колекцію ефектних слайд-шоу і лайтбокс -плагінов. Є в скарбничці і Lighbox виключно на CSS3, без підключення додаткових js-бібліотек. Але час не стоїть на місці, користувачі все частіше використовують для серфінгу інтернету різні мобільні пристрої, а значить адаптивність веб-елементів та зокрема фото-галерей з ефектом «лайтбокс» стає одним з пріоритетів, на який веб-дизайнерам і розробникам варто звертати увагу .

Дивіться демо на сайтах розробників, завантажуйте сподобався плагін і творіть, творіть, творіть.

1. iLightbox

2. SwipeBox

• Залежність. jQuery
• Підтримка браузерами. IE9 +, Chrome, Safari, Firefox, Opera, IOS4 +, Android і Windows Phone
• Ліцензія. Чи не визначив, може вам пощастить)))

3. MagnificPopup

• Залежність. jQuery 1.9.1, або Zepto.js
• Підтримка браузерами. IE7 (partially), IE8 +, Chrome, Firefox, Safari і Opera
• Ліцензія. MIT license

4. PhotoSwipe

• Залежність. немає
• Підтримка браузерами. IE8 +, Chrome, Firefox, Safari, Opera і ще парочка мобільних браузерів
• Ліцензія. MIT license

5. Nivo Lightbox

• Залежність. jQuery
• Підтримка браузерами. IE9 +, Chrome, Firefox, Safari і звичайно Opera
• Ліцензія. MIT license

6. Lightbox для Bootstrap

7. ImageLightbox

• Залежність. jQuery
• Підтримка браузерами. IE9 +, Chrome, Firefox, Safari і Opera
• Ліцензія. На Нема й суду нема

8. MiniLightbox

Назва плагіна говорить сама за себе. Все по самому мінімуму, бібліотека jQuery не потрібна, немає потреби в додатково розмітці, обробка тега із заданим класом для мініатюри, або ж використання атрибута data-image-opened. в якому вказується шлях до повнорозмірною картинки. Ні видио, ні фрейми і інші типи змісту крім зображень не підтримуються. Якщо ви не стурбовані підтримкою старими браузерами і вам не потрібно комбайн, для відображення різного роду змісту, цей малюк вагою в 2кб впорається з поставленим завданням, продемонструвати ваші фотографії, або просто картинки.

9. LightCase

• Залежність. jQuery і CSS3
• Підтримка браузерами. IE9 +, Chrome, Firefox, Safari і Opera
• Ліцензія. GPL license

11. FeatherLight

6 к.бітний lightbox-плагін, для більш-менш підкованих розробників, споряджений усіма найнеобхіднішими функціями. Крім підтримки всіх поширених типів контенту (текст, зображення, iframe, Ajax), присутня можливість підключення додаткового розширення галереї зображень. а також ви можете розробити своє власне розширення для цього плагіна, яке буде повністю відповідати вашим потребам при створенні нового проекту. Як все це господарство (розробка розширення) працює, особливо не вникав, але ті кого цей плагін вставить, думаю розберуться))).

12. LightGallery

• Залежність. jQuery
• Підтримка браузерами. IE7 +, Chrome, Firefox, Safari, Opera, iOS, Android і Windows Phone
• Ліцензія. MIT license

13. StripJS

• Залежність. jQuery
• Підтримка браузерами. IE7 +, Chrome, Firefox, Safari, Opera, iOS 5 + і Android 3+
• Ліцензія. Creative Commons BY-NC-ND 3.0 license

14. LightLayer

15. FluidBox

Fluidbox - лайтбокс плагін виключно для зображень. Кількість всіляких варіацій представлення зображень по-справжньому вражає. Плагін чудово працює з зображеннями в різному виконанні, включаючи плаваючі зображення, зображення з абсолютним позиціонуванням, картинки і фотографії обрамлені рамкою, і мають відступи, з поодинокими зображеннями, і об'єднаними в галерею. Загалом, що даремно воду лити, розписати всі можливості плагіна в коротенькому поданні все одно не вийде, так що краще подивіться демо, покрутіть, повертите і думаю, цей плагін сподобається багатьом.

На цьому мабуть і все! Сподіваюся цей невеликий огляд, допоможе вам розібратися в купі пропонованих продуктів веб-розробки. Хочу зауважити, що далеко не всі з представлених в збірці плагіни я використовував на робочих проектах, більшість з них промацував на тестових майданчиках або на лаколке, так що при виникненні будь-яких питань, швидше за все будемо їх вирішувати разом, а разом, як завжди все у нас вийде.

Буду всім вдячний, якщо підтримаєте проект - додавши блог в виключення AdBlock і поділіться посиланням на запис в своїх соц-мережах: