Главная » Файлы » Прочие скрипты » jQuery

Легко настраиваемый автоскроллер через плагин scrollSomething на jQuery
23.06.14, 08:55:08

Скачать файл




Замечательный скроллер любого нужного контента с очень гибкими настройками

Для начала посмотрите ДЕМО

Установка:

После /head на страницах, где будет использован данный скролл, вставляйте:
Код
<script src="/js/jQuery.scrollSomething-1.0.0.js" type="text/javascript"></script>  
<link href="/css/jQuery.scrollSomething-1.0.0.css" rel="stylesheet" type="text/css" />  

<script type="text/javascript">  
$(document).ready(function(){  
$("#myScrollebleItems1").scrollSomething({  
scrollerWidth: 650,  
scrollerHeight: 125,  
scrollInterval: 5000,  
scrollPrefix: "example1_",  
itemsVisable: 2,  
itemsScrolling: 2,  
buttonPosition: "bottomRight"  
});  
});  
</script>


Разберёмся с настройками:

scrollerWidth: 650, - Ширина скроллера
scrollerHeight: 125, - Высота скроллера
scrollInterval: 5000, - Интервал между прокрутками
scrollPrefix: "example1_", - Префикс (Менять не стоит)
itemsVisable: 2, - Количество видимых элементов
itemsScrolling: 2, - Количество прокручиваемых элементов
buttonPosition: "bottomRight" - Положение кнопок при наведении на скроллер

Следующий код вставляйте в то место, где должен быть сам скроллер:
Код
<div id="myScrollebleItems1">  
<div class="wrapDark">  
Первый элемент скрола с подсказкой тёмного цвета  
</div>  
<div class="wrapLight">  
Второй элемент скролла с подсказкой белого света  
</div>  
<div class="wrapDark">  
Третий элемент скролла с подсказкой тёмного цвета  
</div>  
<span>  
Четвёртый элемент скролла без особой стилизации  
</span>  
</div>


Далее залейте файлы из прикреплённого архива следующим образом:
jQuery.scrollSomething-1.0.0.js - в папку js
jQuery.scrollSomething-1.0.0.css - в папку css

Материал подготовлен Apocalypse

Категория: jQuery | Добавил: Apocalypse | Теги: JQuery, автоскроллер, Через, легко, scrollSomething, на, плагин, настраиваемый
Просмотров: 306 | Загрузок: 0 | Рейтинг: 0.0/0
Всего комментариев: 0
Имя *:
Email: