- Веб-Шаблоны
- Шаблон интернет-магазина
- Шаблоны для CMS
- Facebook шаблоны
- Конструктор сайтов
FAQs
General Tutorials
MonsterONE Subscrioption
Looped слайдер
Ноябрь 15, 2010
Это скрипт слайдера, который используют как для создания слайдеров так и для галерей. Это один из наиболее гибких скриптов для слайдера.
http://github.com/nathansearles/loopedSlider
JavaScript
Чтобы скрипт работал, в index-#.html файле со слайдером должны быть строки HTML кода для того, чтобы добавить loopedslider.js скрипт и jQuery фреймфорк:
В файле index-#.html в области <head> должны быть вот эти строки кода для инициализации функциональности скрипта с основными значениями:
Для инициализации этого скрипта используют <div> элемент с индентификатором id #loopedSlider
HTML
Ниже этот скрипт представлен в HTML:
Весь слайдер помещен в <div> тег с индентификатором (id) #loopedSlider. Внутри находятся два <div> тега: главный контейнер (.container класс) и контейнер Pagination (.pagination-container класс). <div> тег с классом .slides находится внутри главного контейнера и содержит элементы слайдера (или галереи). Поэтому для того, чтобы добавить дополнительный слайд (или изображение в галерею) нужно добавить эту структуру кодирования:
Маркированный список (<ul> тег) с классом .pagination определяет вывод нумерации страниц для слайдера (или галереи)
Для loopedSlider версии 0.5.4 и ниже нужно добавить соотвествующее число якорей.
для loopedSlider версии 0.5.5 и выше плагин сам автоматически добавит необходимый скрипт.
CSS
Скрипт связанных стилей находится в главном файле style.css. Нужно изменить нижеуказанные стили:
Обязательно установите для .container и .slides div то же значение для width.
