Вертикальный слайдер-закладки на jQuery
Скрипты
Вертикальный слайдер-закладки на jQueryПо многочисленным просьбам (ровно 1 человек), предлагаю вертикальный вариант слайдера-закладок на основе jQuery. В отличии от горизонтального слайдера в этом анимация происходит сверху-вниз. Такой слайдер прекрасно будет смотреться в правом, или левом блоке сайта. Можно, также, использовать его как меню для нескольких категорий.
Скрипт слайдера можно скачать и установить на своем хосте. Скачать его можно по следующей ссылке: скрипт вертикального слайдера-закладки.
В основе скрипта лежит фрймворк jQuery. Поэтому выясните, подключен ли он на вашем сайте (если ваш сайт на UCOZ, то подключен). Если jQuery не подключен, то впишите в тело HEAD вашего сайта следующий код:
Структура блока слайдера должна выглядеть следующим образом:
<div>Контент блока 1</div>
<div>Контент блока 2</div>
<div>Контент блока 3</div>
<div>Контент блока 4</div>
</div>
Контент элементов слайдера должен быть взят в тег DIV, или другой тег. Все элементы, в свою очередь, должны быть взяты в блок DIV с определенным классом. Слайдер можно разместить в любом месте страницы сайта в пределах тега BODY.
Сразу после блока слайдера нужно вписать код подключения скрипта и вызов функции запуска слайдера. Код выглядит следующим образом:
<script type="text/javascript"><!--
$(document).ready(function(){
$sptabslidevert.init('spTabSliderVert',300,50,200,400);
});
// -->
</script>
Функция запуска слайдера используется следующим образом:
Параметры у функции запуска слайдера следующие:
- Class - класс DIV блока слайдера.
- Speed - скорость анимации слайдера.
- TabHeight - высота закладкок слайдера.
- Width - ширина слайдера.
- Height - высота слайдера.
Рабочий пример вертикального слайдера-закладок можете увидеть ниже:
Скрипт вертикального слайдера-закладок тестировался на следующих браузерах:
- Opera 10
- Firefox 3.6
- Google Chrom
- Internet Explorer 6
- Internet Explorer 7
Если у вас что-то не получается, пишите в нашем мини-форуме ниже. Также принимаются благодарности и предложения.
Удачи в свершениях!
Вы можете присоедениться к моему микроблогу в Твиттере @SzenProgs. Буду благодарен, если оцените мой труд, и щелкните по звездочкам ниже.
x;z-index:1 }Google+
Вертикальный слайдер-закладки на jQuery
Скрипты
Скрипты, инструкции, справочники
Для работы понадобится jQuery.
| Категория: | Скрипты |
| Просмотрено: | 10523 |
| Рейтинг: | 4.3/9 |
| Дата добавления: | 2011-01-27 07:57, Четверг |
| Добавил: | Szen |
| Теги: | закладки, слайдер |
Рекомендуем
Дополнительно к Вертикальный слайдер-закладки на jQuery
Мини-форум
| № 0 | 2011-01-27 07:57 |
Szen | Здесь вы можете задать вопрос или оставить комментарий по теме "Вертикальный слайдер-закладки на jQuery". |
| Гость |
