Fancyboxes — Cotonti плагин галереи

    Fancyboxes — плагин под Cotonti , с помощью которого можно превратить просмотр изображений и мультимедиа в эффективную демонстрацию с удобным  переключением.

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

    Fancyboxes плагин галереи для Cotonti

    Скрипт fancyBox на базе JQuery от Janis Skarnelis — это простое в настройке и эффективное решение, на основе которого и происходит взаимодействие с изображениями и мультимедиа.

    Скрипт jScale Image Scaler на базе JQuery от JavaScript Kit — это решение с помощью которого можно указать размер всех обрабатываемых изображений в настройках, и они автоматически будут подстраиваться.

    Скрипт Mousewheel на базе JQuery от Brandon Aaron — возможность пролистать несколько изображений без клика, с помощью прокрутки колесика мышки, стоит лишь навести курсор на изображение и прокрутить.

    Архив fancyBox для разработчиков по умолчанию состоит из нескольких скриптов, для разных подключений. В плагине эти скрипты были объединены в один, также в него добавлен скрипт для прокрутки мышкой. Конфигурация находится в отдельном файле fancyboxes.cfg.js.

    Плагин работает сразу после установки, и обрабатывает автоматически изображения gif, png, jpg, jpeg.  Изображения имеющие указанные расширения и являющиеся при этом ссылками (например миниатюра ссылается на оригинал), будут открываться на затемненном фоне, в виде галереи, в зависимости от настроек.

    Подключить обработку swf, видео, можно с помощью присвоения соответствующего класса, а ссылка передается в атрибуте href. Эти виды контента будут выведены с некликабельным фоном, чтобы играя в флеш игру, или просматривая видео, не закрыть его, случайно кликнув по фону. Для изображений фон кликабельный.

    1. Установка плагина Fancyboxes

    1. Распаковать и залить содержимое в папку plugins.
    2. Установить через админпанель: (Управление сайтом / Расширения / Fancyboxes).
    3. Изменить настройки по желанию.

    После установки в панели управления плагином fancyboxes будут доступны следующие настройки:

    vseweb-com-25-1000x1400-auto

    Изменять размересли да, то изображения будут с указанными размерами
    Минимальная ширинавсе изображения уменьшаются до N ширины (высота пропорционально)
    Минимальная высота(если указана ширинавсе изображения уменьшаются до N высоты (при указанной ширине)
    Минимальный размер самой длинной из сторон уменьшит до N размера по самой длинной стороне
    Варианты показагалерея — изображения открываются в виде галереи

    кнопки — галерея + кнопки лево право, автоматическая, полный размер если большое

    миниатюры — галерея + миниатюры изображений

    Отключить скрипт на главнойда отключает скрипт на главной странице
    Подключить CSS модуля/плагинавключение css стилей плагина по умолчанию

    2. Пример вызова медиафайлов

    Изображения (fancybox) подхватываются автоматически, а другие медиа файлы, или ифрейм можно вызывать с помощью присвоения класса:

    Для вызова swf файла по клику, например флеш игры, добавить класс various к ссылке:

    1<a class=»various» href=»http://адрес сайта/файл.swf»>SWF</a>

    Для вызова видео с youtube добавить класс fancybox-media к ссылке:

    1<a class=»fancybox-media» href=»https://youtu.be/ваше видео»>media</a>

    3. Вызов с помощью ajax

    Для вызова файла с помощью ajax добавить класс fancybox fancybox.ajax:

    1<a class=»fancybox fancybox.ajax» href=»http://ваш сайт/ваш файл»>Ajax</a>

    4. Вызов в iframe

    Для вызова файла iframe добавить класс fancybox fancybox.iframe:

    1<a class=»fancybox fancybox.iframe» href=»http://ваш сайт/ваш файл»>Iframe</a>

     

    Близкие по теме «Fancyboxes — плагин Cotonti»

    Поделиться:
    Нет комментариев

      Добавить комментарий

      Ваш e-mail не будет опубликован. Все поля обязательны для заполнения.

      ×
      Рекомендуем посмотреть
      Cогласие на обработку своих персональных данных Политика конфиденциальности Договор публичной оферты