Ну всё вроде просто: есть контент (текст, или фото), и нужно просто через интервал времени показывать блоки по очереди…
Есть список:
В каждом теге списка есть какой-то контент… ЦСС-гламур делать не буду, напишу просто функционал скрипта.
В стилях скрываем список, и показываем только первый блок, можно конечно скрыть все и показывать блок методом яваскрипта, но вдруг скрипты у юзера будут выключены, а так хоть что-то видно :)
#sliders li{
display: none;
}
#sliders li.active{
display: block;
}
Подключаем библиотеку jquery, в <head>.
Теперь скрипт:
/* начальный номер блока который показывать */
var i = 2;
var func_sliders = function(){
/* прячет все блоки */
$("#sliders li").hide();
/* Показывает следующий попорядку */
$("#sliders li").eq(i-1).fadeIn("slow");
/* количество li */
var max = $("#scroller li").size();
/* если показали последний блок, то начинаем с начала */
if (i < max) { i++; } else i=1;
};
/* функция повторяется с интервалом 2000 миллисекунд(2сек.) */
timer = window.setInterval(func_sliders, 2000);
Вот и всё, должно работать, примитивно конечно, но вполне рабочий вариант…
