Десятка Адаптивних Lightbox Плагінів

39

LightBox вважається на сьогоднішній день одним із самих популярних і ефектних способів відображення зображень, мультимедіа та іншого інформаційного контенту без оновлення сторінки. Існує величезна кількість однойменних плагінів LightBox, для створення привабливого ефекту накладання. Останнім часом з’являються досить добрі і працездатні рішення, виконані з допомогою CSS3, без використання javascript.
Реальність диктує умови, а вона така зараз, що адаптивна верстка та дизайн сайтів, це вже не просто чергова модна фішка, а цілком усталена модель представлення веб-сайтів. Шаблони сайтів, елементи інтерфейсу, віджети і плагіни так само еволюціонують, якщо так можна сказати, щоб відповідати адаптивної моделі, для коректного відображення у всіх користувацьких пристроях, від широкоформатних моніторів комп’ютера, до екранів мобільних телефонів. Різноманітні модальні вікна, інформаційні блоки, галереї зображень використовують різні форми LightBox ефекту теж не виняток.

Пропоную на ваш розгляд добірку з десяти адаптивних «лайтбоксів». Всі модальні вікна змінюють свої розміри в залежності від розмірів вікна перегляду і відмінно впишуться на екрани мобільних пристроїв. Я навіть відкопав один цікавий лайтбокс, який пропонується у вигляді безкоштовного десктопного програми під назвою Visual Lightbox, такий своєрідний LightBox-генератор, за допомогою якого ви зможете легко створити свою неповторну галерею зображень з чудовим ефектом подання.

CSS Modal

CSS Modal розроблений на чистому CSS і невеликого javascript. Модальний виконано з використанням методу адаптивного веб-дизайну і відмінно працює на екранах розміром від невеликого мобільного телефону до екранів високого дозволу настільних комп’ютерів. Непогане рішення для виводу інформаційних повідомлень, невеликих галерей зображень або подгружаемого відео з інших джерел, таких як YouTube, Vimeo та інших. На сайті розробника доступні приклади роботи і докладна документація по установці. За допомогою CSS, ви з легкістю зможете сформувати зовнішній вигляд модального вікна на свій смак і колір.

Адаптивный Lightbox CSS

Visual LightBox

А ось і повноцінний автономний LightBox-генератор. Visual Lightbox – відмінна безкоштовна програма, яка допоможе Вам легко створювати веб-галереї зображень з чудовим Lightbox-ефектом. Програма дуже проста в освоєнні і подальшому використанні. Вам не потрібно сидіти і перелопачувати купу додаткового коду, досить перемістити потрібні вам зображення або фотографії в вікно Visual LightBox, без страху і докору натиснути кнопку «Опублікувати», і все, Ваша повноцінна галерея з лайтбокс-ефектом відкриється у вікні браузера. Програма має багато нових тем оформлення і ефектів для ваших галерей, можливість обертання зображення, а також якісного масштабування зі згладжуванням, організація слайд-шоу з функцією автоматичного програвання, вбудований FTP-клієнт і багато інших корисних фішок.

Приложение Visual LightBox

FancyBox

Звичайно ж добре всім знайомий, перевірений і надійний FancyBox, потужний інструмент для організації ефектних уявлень масштабованих зображень, текстового і мультимедійного контенту на сторінках веб-сайтів. Плагін побудований з використанням бібліотеки javascript, jQuery, при цьому дуже простий в установці та налаштування. Розробники плагіна позиціонують своє дітище, як альтернативу широко відомому Lightbox від Leandro Vieira Pinho. Fancybox має досить налаштувань, за допомогою яких ви зможете однаково легко виводити в модальному вікні збільшену картинку при кліці на зменшеному зображенні, організувати галерею слайдів з навігацією, або просто вивести спливаюче вікно з різноманітним змістом. Тепер вся ця краса, чудово буде відображатися на екранах будь-яких пристроїв.

FancyBox плагин jQuery

Magnific Popup

Magnific ще один абсолютно безкоштовний jQuery Lightbox плагін, який орієнтований на краще представлення різного змісту в спливаючих вікнах на екранах будь-яких пристроїв. За допомогою цього плагіна, ви зможете реалізувати перегляд поодиноких масштабованих зображень, так і створити ефектну галереї. Magnific дозволяє легко і просто інтегрувати в спливаюче вікно різні форми, без втрати введених даних при закритті вікна або переході на іншу сторінку. Діалогові вікна з елементами CSS-анімації, вбудоване відео з популярних відео-сервісів, користувацька настройка параметрів і через CSS, стабільна підтримка всіма сучасними браузерами. Для WordPress існує окрема версія, доступна по підписки на новини від автора плагіна.

Magnific Popup адаптивный Lightbox плагин

iLightbox

iLightBox дозволяє без особливих зусиль створювати адаптивні вікна з ефектом затемнення основного фону сторінки. Це вже не просто плагін, а цілий мультимедійний «комбайн», якщо хочете. Чудова робота у всіх браузерах, адаптивна модель, готові скіни, безкоштовна підтримка і оновлення, усе це і багато іншого, роблять iLightbox одним з кращих інструментів в цій лінійці. Всі достоїнства плагіна, в загальному огляді описувати немає сенсу, краще спокійно і більш докладно ознайомитися з ними на сайті розробника.

iLightbox адаптивный плагин

Fresco

Fresco — привабливий, я б навіть сказав, місцями красивий і до всього іншого функціональний представник lightbox-плагінів. Розроблений на jQuery, має стандартний набір властивостей для плагінів цієї серії. Повноекранне збільшення зображень, інтеграція відео з Youtube і Vimeo і повністю адаптивний макет.

Fresco адаптивный Lightbox плагин jQuery

rlightbox2

Перед вами jQuery UI mediabox, який може відображати різні типи контенту, такі як зображення, відео з YouTube і Vimeo. Плагін має декілька унікальних функцій, таких як «панорама»(відображення частини повнорозмірного зображення на екрані) і живе зміна розміру картинки. У комплекті кілька готових тем оформлення і докладна документація.

rlightbox2 адаптивный Lightbox плагин

Chocolat

Базовий jQuery плагін lightbox, відповідно нічого примітного і ефектного від цього плагіна чекати не доводиться, але зі своїм головним завданням справляється відмінно. Мінімалізм в самих жорстких його проявах, по мені так, навіть занадто.

Базовый jQuery плагин lightbox

Shadowbox JS

Shadowbox підтримує всі популярні формати веб-публікацій, включаючи QuickTime, Flash відео, і Windows Media Player. Найпростіший спосіб використання Shadowbox це перегляд збільшеною версією одиночного зображення. Є можливість організації досить-таки динамічною галереї зображень і SWF роликів з автопрокруткой. Shadowbox здатний відображати Flash з допомогою флеш-плагіна веб-переглядача Adobe Flash Player. Якщо Flash не доступний, користувачеві буде запропоновано завантажити та встановити його, перш ніж він зможе переглянути вміст.

Shadowbox JS адаптивный Lightbox плагин

Responsive Lightbox

Назва цього плагіна говорить сама за себе, Responsive Lightbox повністю адаптивний, легкий jQuery lightbox плагін, заточений виключно на роботу з зображеннями.

Адаптивный Lightbox плагин

Ось такі чудові інструменти, з допомогою яких можна зробити свої сайти по справжньому динамічними, а перегляд матеріалів сайту користувачами, ще більш комфортним.

З Повагою, Андрій .

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