Триколор 

Самые лучшие плагины lightbox для Wordpress

В этой статье собраны лучшие jQuery Lightbox плагины, которые помогут вам в создании красивых веб-сайтов.

Эти jQuery плагины используются для добавления на сайт всплывающих окон. Такие плагины являются очень мощным инструментом для любого веб-дизайнера и разработчика, поскольку помогают добиваться весьма красивых эффектов, придающих обычному сайту эффектный и привлекательный вид. Чтобы пользоваться jQuery плагином, вам нужны базовые знания JavaScript и jQuery. Если вы не знаете основ, то просто читайте описание плагина и следуйте инструкции.

LightZoom

Начну с плагина, написанного мной — . Работу плагина вы можете увидеть в этой статье — все изображения кликабельны. Моей целью при его разработке было сделать простой лайтбокс только изображений, без эффектов слайдшоу и т.п.

Легкий, с сенсорной поддержкой, и самое главное модульный плагин, что позволяет убирать не нужные части, которые не нужны. Он работает хорошо в мобильных браузерах. Вы можете менять изображения с помощью движения пальца, как если бы это было стандартное приложение, с плавными переходами.

Lightbox для Bootstrap

Изначально лайтбокс плагин отсутствует в Bootstrap. исправляет это. Если вы используете Bootstrap, рекомендуется использовать эту библиотеку. Плагин хорошо интегрируется с Bootstrap.

Strip

Strip уникальный лайтбокс плагин. Вместо наложения изображения, модуль лайтбокс скользит вместе с изображением от стороны в сторону, так что изображение не будет блокировать все содержимое. Strip поддерживает как изображения так и видео.

— это библиотека JavaScript для создания адаптивных лайтбокс галерей. Легкая и совместимая с мобильной версией, ее легко кастомизировать и использовать плавные переходы изображений в CSS3.

Rebox

Rebox очень легкий и быстрый лайтбокс для контента. В основном, конечно, для изображений. Для инициализации плагина необходимо только подключить библиотеку JS и CSS.

Прекрасный лайтбокс плагин. Поддерживает несколько видов анимаций, такие как: fade, elastic, zoom и scrolling. Кроме того, он также поддерживает различные виды медиа, включая Youtube Embed, HTML видео, SWF и форм ввода.

LightGallery

LightGallery — это легко настраиваемый jQuery плагин для создания адаптивной галереи. В нем есть абсолютно все, что Вам необходимо: просмотр в лайтбоксе, слайд-шоу, увеличение на весь экран, превьюшки. Также пользователь, который просматривает галерею, может сразу скачать картинку.

В отличии от некоторых своих собратьев по цеху, не является комбайном по отображению чего угодно во всплывающем окне. Плагин создан и работает только с целью показа изображений – как одиночных, так и в составе набора (галереи), но от этого не становится менее привлекательным.

jQuery Lightbox Plugin

Плагин jQuery LightBox простой, изящный, ненавязчивый, не требует дополнительной разметки и используется для наложения изображений на текущей странице благодаря мощности и гибкости селектора jQuery.

Позволяет создавать диалоговые окна в стиле facebook, при этом допускается создавать диалоговые окна с помещением в них простого текста некоторых элементов, изображений, ajax страниц.

Служит для создания фотогалерей и вывода другого контента в красивых модальных окнах. Если вы планируете на сайте и фотогалерею и размещение некоторого контента в модальных окнах, то обратите внимание на этот скрипт.

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

ImageLightbox.js — это лайтбокс только для изображений, а не для видео, текста и фреймов одновременно. По умолчанию никаких заголовков, кнопок навигации или фона нет.

Представляет собой jQuery UI mediabox, который способен отображать множество типов контента, включая изображения и видео из YouTube и Vimeo. Здесь есть множество уникальных свойств, включая Panorama и Live Re-size.

jQuery TosRus

jQuery TosRus — удобный и функциональный jQuery плагин для работы с видео и изображениями. Скрипт может выступать в роли лайтбокс-инструмента и горизонтального слайдера одновременно. Контент в модальных окнах по умолчанию отзывчивый. Адаптирован под сенсорные устройства.

— это одна из разновидностей лайтбокса, на jQuery, с более продвинутым функционалом чем у традиционных. Как и все аналоги, имеет кучу настроек для управления прозрачностью фона, скоростью показа, эффектами, размерами, надписями и т.д.

– это JQuery плагин, разработанный, чтобы реализовать ненавязчивый, адаптивный лайтбокс , который идеально подходит для изображений с большим разрешением. Он отлично работает на мобильных устройствах, а также может применяться на экранах с более высоким разрешением для красивого вывода изображений.

– jQuery -плагин для стационарных компьютеров, смартфонов и планшетов. Он поддерживает сенсорное управление для мобильных устройств, навигацию с помощью клавиатуры для настольных устройств, CSS переходы с резервным переключением на управление JQuery , довольно прост в настройке.

jQuery Superbox

jQuery Superbox позволяет очень просто создавать лайтбоксы для изображений, групп изображений, внешних страниц, или определенного содержимого. Плагин полностью доступен и понятен, и использует атрибут «rel» для запуска скрипта и «href» для указания адреса изображения или страницы.

— jQuery лайтбокс плагин с широкой поддержкой различных медиа форматов: в том числе видео, Flash / SWF, Ajax, фреймов и карт. Этот плагин также добавляет кнопки социальных сетей в верхней части, позволяя своим пользователям обмениваться его Facebook, Twitter или Reddit. Кроме того есть дополнительные настройки, чтобы увидеть, которые могут применены в различных случаях.

– это еще один адаптивный JQuery Lightbox плагин, который подходит для отображения изображений, iFrames , Google-Maps , Vimeo и YouTube видео. Плагин рассчитывает максимальную ширину изображения на экране и сохраняет пропорциональную высоту, даже если она больше, чем высота окна.

Позволяет вам легко создавать красивые всплывающие окна, используя jQuery. Вы можете усовершенствовать ваш медиа-контент автоматически или создавать всплывающие окна на ваш вкус, используя мощный API.

— отличный адаптивный лайтбокс. Его можно использовать для создания сногшибательных галерей, которые будут отлично выглядеть на любых экранах.

Magnific Popup — это удобный в работе плагин jQuery lightbox, сосредоточенный на производительности. Его главная цель – обеспечить удобство работы на любом устройстве.

Базовый плагин, весом 6 килобайт для разбирающихся разработчиков и включает в себя только самое необходимое. Если вам нужен лайтбокс эффект, например, для группы изображений в галерее, вы можете включить расширение галереи. Вы также можете разработать свое собственное расширение для плагина, чтобы использовать в своих проектах.

Много раз делал обзоры различных галерей изображений, собрал обширную коллекцию эффектных слайд-шоу и -плагинов. Есть в копилке и Lighbox исключительно на CSS3, без подключения дополнительных js-библиотек. Но время не стоит на месте, пользователи всё чаще используют для сёрфинга интернета различные мобильные устройства, а значит адаптивность веб-элементов и в частности фото-галерей с эффектом « » становится одним из приоритетов, на который веб-дизайнерам и разработчикам стоит обращать внимание.

Представляю очередную подборку из 15 адаптивных jQuery плагинов , которые дружат, как с десктопными браузерами, так и отлично вписываются в экраны различных мобильных устройств (ноутбуки, смартфоны, планшеты и т.д.).

Смотрите демо на сайтах разработчиков, скачивайте понравившийся плагин и творите, творите, творите...

1. iLightbox

iLighbox — это лёгкий Лайтбокс-плагин jQuery с поддержкой широкого диапазона различных типов файлов: изображения, видео, Flash / SWF, содержание Ajax, фреймы и встроенные карты. Этот плагин также добавляет кнопки социальных сетей, что позволяет пользователям обмениваться контентом через Facebook, Twitter или Reddit. Отличная возможность организации эффектных слайд-шоу, галерей изображений и видео-роликов, с просмотром в обычном, и полноэкранном режимах.

iLighbox работает довольно шустро и при просмотре на мобильных устройствах, более чем корректно отображает обрабатываемый контент. Кроме всего прочего, используя этот плагин, вы легко сможете реализовать вывод информационных блоков по типу модального окна.

  • Зависимость : jQuery
  • Поддержка браузерами : IE7+, Chrome, Firefox, Safari и Opera
  • Лицензия : А чёрт её знает)))
2. SwipeBox

Swipebox — это плагин JQuery с поддержкой сенсорных экранов мобильных платформ. Помимо изображений плагин поддерживает встраиваемое видео с Youtube и Vimeo. Swipebox очень просто прикрутить к любому проекту, плагин имеет несколько интуитивно-понятных опций для настройки его функционал и поведения. На сайте разработчика подробнейшая документация по подключению и использованию плагина, без лишней воды всё только по делу, так что разобраться что, куда, и зачем, думаю будет не сложно.

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

3. MagnificPopup

Давно известный и хорошо себя зарекомендовавший лайтбокс-плагин на jQuery или Zepto.js. Автор плагина — Дмитрий Семенов, являющийся разработчиком и плагина PhotoSwipe, о котором расскажу чуть ниже. Поставляется в виде плагина jQuery/Zepto, имеет более широкие возможности отсутствующие в PhotoSwipe, такие как поддержка видео, отображение карт и Ajax содержания, реализация модальных окон с встроенными формами. По всем критериям, это ещё один замечательный инструмент в обойме веб-разработчика. Отдельно имеется плагин для WordPress и подробнейшая документация по настройке, и использованию. Удручает только отсутствие документации на Русском, судя по имени и фамилии автор вроде бы Русский, никогда не понимал из-за вредности это, или же из-за мнимого осознания своей навороченности, да мля. Ну да ладно, кому оно надо разберётся, мы тоже чай не всмятку сварены))).

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

4. PhotoSwipe
  • Зависимость : Javascript или jQuery
  • Поддержка браузерами
  • Лицензия : MIT license

11. FeatherLight

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

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

12. LightGallery

LightGallery — многофункциональный лайтбокс-плагин с множеством дополнительных возможностей. Поставляется с более чем 20 опций, для настройки мельчайших деталей Lightbox. Здесь есть всё, ну, или почти всё)). Полноценная галерея изображений с аккуратно выстроенными миниатюрами, с элементами навигации и прокруткой миниатюр. Простая html-разметка в виде неупорядоченного списка

    с использованием атрибута data-src для полноразмерных картинок. Тоже самое и с видео из Youtube и Vimeo. Замечательно поддерживает все форматы видео HTML5, MP4, WebM, Ogg... Анимированные миниатюры, адаптивный макет с поддержкой мобильных устройств, слайд-эффекты и плавные переходы появления при переключении изображений, и другого контента. Внешний вид легко формируется и настраивается с помощью CSS. Предварительная загрузка изображений и оптимизация кода. Навигация с помощью клавиатуры для десктопов, а также возможность использования дополнительных шрифт-иконок. LightGallery — вот где настоящий «комбайн», главное не потеряться в обилии настроек и обширных возможностях этого плагина.
    Тем кому нужен приличный слайдер, рекомендую обратить внимание на от этих же разработчиков.

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

    13. StripJS

    Непривычная, я бы даже сказал: необычная реализация lightbox, точнее, не совсем привычное представление содержания, когда изображение или видео, в оформлении лайтбокса, появляются справа, заполняя при этом не весь экран, а лишь на заданный размер полноразмерной картинки или видео. На больших экранах такой подход понятен, остаётся возможность взаимодействия со страницей. На маленьких экранах мобильных устройств, вся эта инновационная конструкция, плавно переходит в классический «лайтбокс». Задумка интересная, посмотрите демо, может кого и вставит такой креатив.

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

    14. LightLayer

    Простой в использовании плагин лайтбокса, который хорошо сочетается с любым проектом и также хорошо смотрится на любом экране. В плагине LightLayer представлен контроль над множеством настроек, такими как изменение цвета фона и степени его прозрачности, положение базового блока, выбор эффектов переходов при открытии/закрытии, функции которыми пользователи могут манипулировать самостоятельно. Плагин отлично работает с содержанием внешних веб-сайтов, встроенными видео-плеерами и картами.

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

    15. FluidBox

    Fluidbox — лайтбокс плагин исключительно для изображений. Количество всевозможных вариаций представления изображений по-настоящему впечатляет. Плагин замечательно работает с изображениями в различном исполнении, включая плавающие изображения, изображение с абсолютным позиционированием, картинки и фотографии обрамлённые рамкой, и имеющие отступы, с одиночными изображениями, и объединёнными в галерею. В общем, что зря воду лить, расписать все возможности плагина в коротеньком представлении всё равно не получится, так что лучше посмотрите демо, покрутите, повертите и думаю, этот плагин понравится многим.

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

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

    С Уважением, Андрей

    Создание фотогалереи на сайте Фотогалерея LightBox2 - установка и настройка

    В одной из предыдущих статей было рассказано о самой, наверное, популярной бесплатной фотогалерее - Lightbox , созданной на основе библиотеки скриптов jQuery . На базе Lightbox веб-дизайнеры разработали множество интересных клонов, но и первоначальный вариант до сих пор продолжает развиваться и с успехом применяется для фотогалерей на множестве сайтов. Рассмотрим его последнее обновление - плагин Lightbox2 , отличающийся небольшим размером и как всегда, простой установкой на сайт. При этом Lightbox2 имеет привлекательный дизайн, работает во всех браузерах и, что особенно приятно, корректно выводит большие изображения, сжимая их в соответствие с размером экрана пользователя.

    Разработчик плагина Lightbox2 - Lokesh Dhakar , программист из Сан-Франциско. В настоящее время (2014 год) доступна версия Lightbox v2.7.1, которую и попытаемся установить на сайт. Пример разворачивания одиночного изображения c помощью LightBox2 показан на рисунке.

    Установка фотогалереи LightBox2 Для установки фотогалереи LightBox2 сначала создадим на сайте новую папку, назвав её, конечно же, lightbox2 . Эта папка должна находиться в том же каталоге, что и страница с фотогалереей. Затем скачиваем архив и распаковываем его в созданную папку. У нас получится в ней два скрипта (*.js ), вспомогательные картинки (папка img ) и файл CSS (*.css ). Далее вставим в заголовок страницы с будущей фотогалереей внутрь тега ... следующие строчки, указывающие пути к нашим новым файлам:

    Важное замечание: если на вашем сайте используется несколько плагинов jQuery , то удобнее перенести файл jquery.js (желательно последней версии) в корневую папку, чтобы не загружать его несколько раз. В этом случае, строка обращения к нему будет выглядеть одинаково для всех плагинов. В частности, для нашего примера получается так:
    .
    Не рекомендуется использовать на одной странице несколько разных версий jQuery , чтобы они не конфликтовали друг с другом. При этом обязательно проверяйте работу плагинов с установленной версией jQuery , так как не все версии взаимозаменяемы.

    Теперь необходимо разместить на странице сайта нужные изображения. Как обычно, каждое должно быть представлено в виде миниатюры (small) и полноразмерной картинки (big), на которую указывает ссылка с миниатюры. В теге ссылки дополнительно указываем rel="lightbox" - для одиночного изображения, а если хотим объединить в галерею несколько картинок, то через дефис любое выражение, одинаковое для всех, например, rel="lightbox-one"


    и так далее.

    Если необходимо делать надписи к изображениям, то размещаем их в title ссылок.
    Пример простой фотогалереи из трех изображений показан на рисунке:

    Важное замечание: если размер основного изображения (big.jpg ) больше размера экрана в браузере пользователя, то LightBox2 автоматически подгоняет (уменьшает) его под размер экрана. При этом увеличенная картинка всегда вписывается в экран, независимо от того, какое устройство используется для просмотра: смартфон, планшет или монитор высокого разрешения.

    Поэтому желательно, чтобы большое изображение имело запас по разрешению, например, не менее 1000 пиксел по вертикали для стандартного экрана Full HD - 1920х1080. В нашем примере, это картинка "Субботник".

    Настройка фотогалереи LightBox2

    Для настройки фотогалереиоткройте файл lightbox.js в любом HTML- или текстовом редакторе, например, в Блокноте. В самом начале файла увидите доступные настройки:
    this.fadeDuration = 500; //время открытия картинки мс
    this.fitImagesInViewport = true; //подгонка под размер экрана true/false
    this.resizeDuration = 700; //время разворачивания картинки мс
    this.positionFromTop = 50; //отступ окна lightBox сверху экрана
    this.showImageNumberLabel = true; //вывод номера картинки true/false
    и т.д.

    Основные из них снабжены комментариями на русском языке. Изменяйте значения параметров, и после сохранения файла lightbox.js можете наблюдать результат, открыв страницу с вашей фотогалереей в браузере.

    Некоторые параметры окна галереи, например, цвет фона и его прозрачность, цвет надписи и др. задаются в CSS-файле lightbox.css . Вспомогательные картинки (вперед, назад, загрузка, выход) расположены в папке img , и их также можно менять на ваше усмотрение.

    О других программах создания на сайте фотогалерей, каруселей изображений и слайд-шоу смотрите в и в разделе "

    Two individual images

    Four image set

    Getting started

    Download the latest version as a zip file
    Or use a package manager...
    NPM: npm install lightbox2 --save

    Bower: bower install lightbox --save

    Open up the zip file and take a peek at the barebones, working example that is included in the /examples folder.

  • Ready to set Lightbox up on your page? Start by including the Lightbox CSS and Javascript. You can grab both these files from the /dist folder.

    • Include the CSS at the top of your page in your tag:
    • Include the Javascript at the bottom of your page before the closing tag:

  • Make sure jQuery, which is required by Lightbox, is also loaded.

    • If you already use jQuery on your page, make sure it is loaded before lightbox.js . jQuery 1.7 or greater is required.
    • If you are not currently using jQuery, I"ve created a packaged file that includes both Lightbox and jQuery. Include dist/js/lightbox-plus-jquery.js instead of lightbox.js .
  • Confirm that the four images loaded by lightbox.css are in the correct location. You can grab the images from the /dist/images folder.
    • Initialize with HTML
    • Single images. Add a data-lightbox attribute to any image link to enable Lightbox. For the value of the attribute, use a unique name for each image. For example: Image #1 Optional:
      • Add a data-title attribute if you want to show a caption.
      • Add a data-alt attribute if you want to set the alt attribute of the linked image.
    • Image sets. If you have a group of related images that you would like to combine into a set, use the same data-lightbox attribute value for all of the images. For example: Image #2 Image #3 Image #4
    Options

    If you want to change any of the default options, call the option method.

    lightbox.option({ "resizeDuration" : 200 , "wrapAround" : true }) Option Default Description
    alwaysShowNavOnTouchDevices false If true, the left and right navigation arrows which appear on mouse hover when viewing image sets will always be visible on devices which support touch.
    albumLabel "Image %1 of %2" The text displayed below the caption when viewing an image set. The default text shows the current image number and the total number of images in the set.
    disableScrolling false If true, prevent the page from scrolling while Lightbox is open. This works by settings overflow hidden on the body.
    fadeDuration 600 The time it takes for the Lightbox container and overlay to fade in and out, in milliseconds.
    fitImagesInViewport true If true, resize images that would extend outside of the viewport so they fit neatly inside of it. This saves the user from having to scroll to see the entire image.
    imageFadeDuration 600 The time it takes for the image to fade in once loaded, in milliseconds.
    maxWidth If set, the image width will be limited to this number, in pixels. Aspect ratio will not be maintained.
    maxHeight If set, the image height will be limited to this number, in pixels. Aspect ratio will not be maintained.
    positionFromTop 50 The distance from top of viewport that the Lightbox container will appear, in pixels.
    resizeDuration 700 The time it takes for the Lightbox container to animate its width and height when transition between different size images, in milliseconds.
    showImageNumberLabel true If false, the text indicating the current image number and the total number of images in set (Ex. "image 2 of 4") will be hidden.
    wrapAround false If true, when a user reaches the last image in a set, the right navigation arrow will appear and they will be to continue moving forward which will take them back to the first image in the set.
    Browser support

    Lightbox2 has been tested successfully in the following browsers:

    • Internet Explorer.
      The lightbox-plus-jquery.js file includes jQuery v2.x and supports IE 9+. If you want to support IE 6, 7, and 8, use your own copy of jQuery v1.x with lightbox.js .
    • Chrome
    • Safari
    • Firefox
    • iOS Safari
    • iOS Chrome
    • Android Browser
    • Android Chrome
    Help Have a question about how to use Lightbox?

    Follow the steps below to get help. Make sure you have read the documentation on this page and looked at the included example first.

  • Search Stackoverflow to see if other people have run into the same issue you are having.
  • If your issue is unique, then post a new question on Stackoverflow . Use the lightbox2 tag.

    • Do not use Github Issues to report personal support requests.

    → Lightbox на jQuery

    В статье приведен пример запуска плагина галереи lightbox на jquery и здесь же можно скачать рабочий вариант. Вот так она собственно работает:



    Данная реализация lightbox хороша тем, что ею можно управлять через конфигурационный хеш. Запускается очень легко. Для запуска плагина необходима любая библиотека jquery, начиная с версии 1.2.6, сам плагин lightbox и стилевой файл. В архиве, чуть ниже, лежит готовый вариант. Скачайте, распакуйте и откройте файл index.html в любом браузере. Должно работать.

    Надеюсь как запустить всем понятно. Расскажу лишь как управлять настройками lightbox. Сразу отмечу, что плагин не работает в IE 6, и поэтому ставим условие инициализации для всех кроме «ослика». Далее еще один важный момент: $(document).ready , так как до готовности дерева DOM инициализации не прокатит. Сам процесс инициализации происходит так:

    $("#gallery a").lightbox();

    Пример исходного кода:





    if (!(navigator.userAgent.indexOf("MSIE 6") >= 0)){ $(document).ready(function(){ $("#gallery a").lightbox(); $.Lightbox.construct({ "speed": 500, "show_linkback": true, "keys": { close: "q", prev: "z", next: "x" }, "opacity": 0.8, text: { image: "Картинка", of: "из", close: "Закрыть", closeInfo: "Завершить просмотр можно, кликнув мышью вне картинки.", help: { close: "", interact: "Интерактивная подсказка" }, about: { text: "", title: "", link: "/index.shtml" } }, files: { images: { prev: "/demo/img/jquery-lightbox/prev.gif", next: "/demo/img/jquery-lightbox/next.gif", blank: "/demo/img/jquery-lightbox/blank.gif", loading: "/demo/img/jquery-lightbox/loading.gif" } } }); }); }

    speed - скорость эффекта открытия фото и его закрытия, в милисекундах.

    Параметры хеша keys: close, prev и next это клавиши, которыми осуществляется альтернативное управление просмотром галереи.

    opacity - прозрачность затемняемого фона. Принимает значения от 0 до 1. Цвет фона можно поменять в стилевом файле.

    Параметры хеша images, вложенного в хеш files, это пути к картинкам для фона, анимации индикатора загрузки и кнопок назад-вперед.

    Так же в хеше text можно менять надписи для навигации.