20 AJAX галерей на jQuery

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

jQuery LightBox и аналоги

1. jQuery Lightbox пожалуй самая известная из всех. Изначально она вроде как появилась в связке с библиотекой Prototype, но со временем прижилась и у jQuery. Очень хорошая галерея. Использовал её в нескольких проектах, например вот здесь.

      

    

2. 
   Я бы назвал Interface Imagebox как “Найди 5 отличий от jQuery Lightbox”. Этим всё сказано .
      

    

3. ThickBox позволяет делать галереи наподобие jQuery Lightbox, но при этом позволяет работать не только с изображениями, но и с различным контентом. Например, можно делать всплывающие формы авторизации или ещё что.
      

    

4. FancyBox. Описание галереи читать у ThickBox .
        

    

jQuery слайдеры и карусели

5. jQuery Image Strip. Галерея представляет из себя слайдер: щёлкаем по циферкам, прокручиваются слайды. В общем коробочка со слайдами, смотрится симпатично, применение найти можно.
      

    

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

    

7. jQuery Gallery Scroller (jqGalScroll) похож на предыдущую галерею. В статье (по ссылке "Инфо") можно видеть пример, где отсутствует анимация прокручивания слайдов. Однако если посмотреть страницу ниже, то будет ссылка на пример, где это реализовано (можно посмотреть по ссылке "Пример").
        

    

8. jCarousel Lite - это приятный простой слайдер: клацаем влево или вправо, и маленькие картинки перемещаются туда-сюда. 2кб удовольствия. Практика показала, что довольно успешно сочетается с jQuery Lightbox (посмотреть пример можно по ссылке). В общем я попробовал, остался доволен.
      

    

9. jCarousel. Продвинутая версия карусельки jCarousel Lite. Позволяет также работать и с текстом.
        

    

10. jQuery ScrollShow. jQuery ScrollShow - это слайдер-каруселька. Похожа на предыдущие два экземпляра.
       

     

11. jQuery SerialScroll. От автора предыдущего скрипта. Примеры воодушевили и очень понравились. По сути такой же как и в предыдущих трёх пунктах слайдер, но позволяет работать с абзацами текста, что смотрится очень даже эффектно. jQuery SerialScroll очень неплоха. Примеры можно посмотреть тут.
         

     

12. Photo Slider. Слайдер, уже немного другого типа: есть полоска с миниатюрами изображений, клацая по которым вспециальный блок подгружается оригинальное изображение. Photo Slider позволяет делать слайдшоу – клацаем по кнопке play и наслаждаемся видами.
       

     

13. EOGallery. Галерея, очень похожая на предыдущую, но имеющее два превью. Прокручивая галерею, просматриваемое изображение, по отношению к предыдущим, увеличено по размеру. А если понадобится рассмотреть детали, то кликнув по фотографии можно увидеть её полностью. Название и описание изображения можно указывать – будут обновляться в отдельном блоке.
       

     

Галереи по классике

По классике это те, которые представляют собой список миниатюр, клацая по которым в какой-то блок загружается картинка.

14. jQuery Gallery View II (jqGalView II). Самая простая из таких галерей. И что самое забавное, самая багнутая. По крайней мере пример такой. Кликнув по фотографии никакой таймер не отобразится и надо партизански выждать загрузки фотографии. Неудачное решение. Возможно всё можно настроить, но вот не знаю насколько это реально.
       

     

15. jqGalView III. Третья версия предыдущего плагина. С анимацией переключает фотографии. Неплохое решение. Вот только непонятно почему автор удалил про него статью и в итоге он теперь недоступен. Возможно это временно, а быть может и нет
16. j-Gallery. Галерея одного японца. Простота полная. Во время загрузки фотографии отображается значок загрузки.
     

     

Другие галереи

17. jQuery Cycle. Есть одно изображение, которое при помощи различных анимаций сменяется другим. Вроде очень даже стабильный плагин, применения так и просит в каких-нибудь шапках и боковых панелях.
       

     

18. jQuery Thumbs. Превращает налету крупные изображения в превью. Актуальность этого плагина не очень понимаю.
     

     

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

     

20. Lazy Load Images. Плагин для случаев, когда на странице много рисунков. Он делает такую вещь, что прокручивая вниз страницу, появляющиеся изображения как бы всплывают. Смотрится эффектно, приятная штука.
         

     

Кислая малина

Не стал включать в список два плагина, потому что их использование сомнительно из-за тормознутости. Первый – jQuery Multimedia Portfolio. Делает блок с полосой прокрутки, что очень напоминает меню на сайте Apple. Всё бы хорошо, но вот пример так тормозит, просто ужас. Конечно можно было бы попробовать не вставлять туда видео, а взять 5-10 изображений, но что-то подсказывает, что это не поможет (да ты может и не прав, батька – прим.ред.). А второй – Zoomi (Zoomable Thumbnails). Лично у меня он тормозит как и предыдущий. Конечно может примеров много на страницу закинуто, но всё таки это не дело.

Послесловие

Галерей много, есть что выбрать, есть что сочетать. Есть также галереи не связанные с jQuery и порой значительно отличающиеся, но о некоторых из них я напишу как-нибудь потом. Впрочем, несколько галерей мы рассмотрим потом на примерах. А пока, до новых встреч=).

AJAX, jQuery, галереи, красивости, полезности

(голосов: 9, средний: 5.00 из 5)