jShowOff - плагин jQuery для слайдшоу
 

jShowOff - это плагин jQuery, который создает модуль для демонстрации контента. В основу его работы положено создание слайдов из элементов наследников (например, <li>) в контейнере (например, <ul>) для которого вызывается .jshowoff(). Он сменяет слайды. При этом процесс показа можно настроить с помощью различных опций, а на слайдах использовать различный контент, в том числе и ссылки.

 

Необходимые файлы

1. Библиотека jQuery (1.3+)
2. jquery.jshowoff.min.js

Для базового функционирования достаточно включения выше названных файлов на странице, создания необходимой разметки и вызова метода. Можно использовать стили по умолчанию (jshowoff.css) из демонстрации. Примечание: исходные файлы плагина содержатся  на github.com/ekallevig/jShowOff.

 

Как использовать

Необходимая разметка для плагина jShowOff состоит из родительского элемента с одним или несколькими элементами наследниками, которые используются как слайды. Вот пример базовой структуры, которая будет иметь два слайда:

<div id="features">
	<div><p>Это слайд!</p></div>
	<div><a href="http://google.com"><img src="http://www.google.com/intl/en_ALL/images/logo.gif" alt="Google Logo" /></a></div>
</div>
<script type="text/javascript">		
	$(document).ready(function(){ $('#features').jshowoff(); });
</script>

 

Опции

jShowOff имеет несколько опций для настройки.  Для использования опций нужно передать объект методу .jshowoff():

$('#features').jshowoff({ speed:1500, links: false }); });

 

Опция	Тип	Значение по умолчанию	Описание
animatePause	boolean	true	Определяет использование анимации текста 'пауза' при включении паузы.
autoPlay	boolean	true	Определяет автоматическое проигрывание.
changeSpeed	integer	600	Скорость перехода в миллисекундах.
controls	boolean	true	Определяет создание и вывод элементов управления (старт/пауза, дальше, предыдущий).
controlText	object	{ play:'Play', pause:'Pause', previous:'Previous', next:'Next' }	Текст для элементов управления (старт/пауза, предыдущий, следующий).
cssClass	string	true	Добавляет дополнительный пользовательский класс к контейнеру .jshowoff.
effect	string	'fade'	Тип эффекта перехода: 'fade', 'slideLeft' или 'none'.
hoverPause	boolean	true	Определяет остановку проигрывания при нахождении курсора мыши над контейнером.
links	boolean	true	Определяет создание и вывод цифровых ссылок на каждый слайд.
speed	integer	3000	Время показа каждого слайда в миллисекундах.

Живой просмотр

 

 

Скачать

Пожалуйста, оцените:

1 2 3 4 5 6 7 8 9 10

Комментарии

Комментариев нет

Оставить свой комментарий

Обязательные поля отмечены символом *

*Имя:
Email:
*Комментарий:
*Код на картинке:   Вернуться назад