Абсолютно настраиваемый слайдер Pro
Разработано в CODEROID специально для marketplace.
Слайдер контента и изображений.
Подписи на каждом слайде можно располагать и изменять в любом месте.
Некоторые опции слайдера:
Добавлена поддержка тач-событий для устройств IOS и Android.
Изображения и превью слайдера полностью с изменяемыми размерами.
Настраиваемые эффекты перехода для каждого слайда.
Свободно позиционируемые и стилизованные подписи.
Кросс-браузерная совместимость.

Адаптивные заголовки

Это продукт, который вы все ждали ! Слайдер использует множество эффектов переходов, появлений изображений. В целом он работает на всех браузерах (включая IE6 / 7/8) и на iOS и устройствах Android!

Настраиваемый сладер Pro


Компонент представляет собой настраиваемое слайдшоу множеством эффектов.
При установке компонента импортируются демо-данные и компонент легко адаптировать к своему сайту. 

Отличие данного компонента от аналогичных решений:

  • Кроме фона изображения дополнительно можно выводить неограниченное количество дополнительных текстовых блоков, каждый из которых имеет свои отдельные настройки позиционирования и появления;
  • Предустановлены разные классы (внешний вид) появляющихся блоков;
  • Множество настроек и эффектов для каждого слайда;
  • Автоматическая подгонка размеров изображений слайдов и появляющихся текстовых блоков;
  • Слайдер работает как на старых, так и на современных браузерах;

Структура инфоблока для компонента:

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

В свойствах раздела указывается изображение для слайда 


и эффект появления


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


Сортировка элементов инфоблока определяет порядок появления дополнительных текстовых блоков. При добавлении элемента инфоблока необходимо заполнить ряд параметров для появления нужного текстового блока:


Заполняем следующие параметры:
  • Вид перехода (всего 9 вариантов данного эффекта) - эффект появления текстового блока;
  • Смягчение (всего 30 вариантов данного эффекта) - дополнительный эффект после появления;
  • Ширина и Высота - данные поля не являются обязательными к заполнению. Стили к блоку будут применены автоматически. Данные поля необходимо заполнять если в качестве появляющегося эффекта нужно использовать всю высоту (или ширину) слайдера не зависимо от контента (см. в демо примере блок контента на слайде № 4);
  • Отступ слева (px) - отступ от левого края слайдера. Конечная точка где будет располагаться блок после эффекта появления;
  • Отступ сверху (px) - отступ от верхнего края слайдера. Конечная точка где будет располагаться блок после эффекта появления;
  • URL адрес - если данное поле заполнено, то заголовок становится ссылкой на заданный URL;
  • CSS класс - выбор одного из 8-ми стилевых решения обрамления Вашего блока;
После этого переключаемся на вкладку "Подробно" и в поле "Детальное описание" вводим нужный текст для появления. 


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

И в завершении можно еще настроить общие параметры отображения всего слайдера:

Настройки параметров компонента слайдера:

Настройки компонента имеют 27 всевозможных настроек, позволяющих сделать ваш слайдер не повторимым и уникальным:


Поясним назначение данных параметров:
  • Автопроигрывание слайдов - понятно из названия. Если "чекбокс" установлен то слайды начнутся проигрываться автоматически после загрузки слайдера и будут сменяться автоматически через заданное время;
  • Время показа слайда в микросекундах - понятно из названия. Для сведения - 1000 микросекунд равны одной секунде;
  • Управление клавиатурой - при установленном "чекбоксе" переключать слайды можно с помощью клавиш влево и вправо (даже если фокус не на слайдере);
  • Индекс текущего слайда - с какого номера слайда начинать воспроизведение слайдов;
  • Количество строк для анимации 'жалюзи' - на сколько строк "разрезается" изображение при появлении эффекта "Жалюзи";
  • Количество колонок для блочной анимации - на сколько колонок "разрезается" изображение при появлении эффекта блочной анимации;
  • Количество строк для блочной анимации - на сколько строк "разрезается" изображение при появлении эффекта блочной анимации;
  • Скорость появления строк в микросекундах - понятно из названия;
  • Прозрачность надписей слайдов - указание индекса прозрачности (от 0 до 1);
  • Показывать кнопки переключения слайдов - см. блок 4 на скриншоте ниже;
  • Скорость перехода между слайдами в микросекундах - понятно из названия;
  • Прозрачность сроки навигации - указание индекса прозрачности (от 0 до 1); 
  • Показывать превью картинки в навигации - см. блок 3 на скриншоте ниже;
  • Приостановить показ слайдов при наведении на слайд - при появлении курсора мыши на слайдере, показ слайдов переходит в режим паузы;
  • Перемешать слайды случайным образом - понятно из названия;
  • Шаблон таймера - см. блок 5 на скриншоте ниже. Таймер может быть 3-х видов, горизонтальный и 2 вида круглых;
  • Цвет фона таймера, цвет таймера, прозрачность таймера, диаметр таймера, отступ таймера (padding), толщина таймера, толщина полоски таймера, цвет полоски таймера, стиль полоски таймера, отступ таймера слева, отступ таймера справа - все эти параметры вполне понятны из названий.

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

К выпуску готовится большое обновление данного слайдера:
  • поддержка скинов;
  • несколько скинов (включая полностью адаптивный);
  • больше настроек для слайдера;
  • улучшения в DEMO данных;
После выпуска обновления стоимость компонента может повыситься, поэтому рекомендуем купить прямо сейчас;
Загрузка

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

На правах рекламы