JQuery слайдер для новостей на сайте

JQuery слайдер для новостей на сайте

2011-04-1932289
Для того, чтобы сэкономить место на сайте, сделать упрощенный и компактный вид, Вам понадобится JQuery слайдер для новостей. Из этой готовой функции можно сделать не только перелистывание новостей, можно сделать слайдшоу из фотографий. Сделать можно что угодно, слайдер будет транслировать то, что помещено в специальные блоки. Пример можно привести очень известный: Вы, наверное, часто видите на сайтах рекламу от Google, так вот именно там применяется схожий по аналогии скрипт.

Демо



Для начала Вам необходимо подключить JQuery к сайту (можно скачать и загрузить на собственный сайт). Можно использовать следующий код:



Код



Параметр скрипта scrollSpeed отвечает за скорость смены новостей в слайдере. Может быть как числовым (миллисекунды), так и одним из приведенных ниже:

slow - медленно
normal - стандартно
fast - быстро


Параметр ScrollDelay скрипта слайдера определяет время показа одной новости (в миллисекундах).

Разумеется, без каскадного стиля нам не обойтись.



Теперь нужно оформить блок для слайд-шоу. Порядок тегов и их классы нужно соблюдать строго. Блок вставляете туда, где бы Вы хотители его увидеть. Для четырех новостей используется следующая структура:



Код <div class="scrollItem">Блок 1</div> можно ставить в таком количестве, сколько вам нужно. Если вы прокручиваете 10 новостей, то и код ставите в количестве 10 штук. Внутри кода можно расположить как текст, так и картинки, таблицы, в общем все, что хотите.


Комментарии (9)
Артем Василькин 2011-04-20 в 07:10Спам
все отлично разбяснено и понятно) но все-равно хочется демо
4
Денис Абдуллин 2011-04-20 в 11:46Спам
Ок, демо установлено на странице
5
Дамир Гаянов 2011-04-20 в 12:55Спам
Хорошо!
5
Артем Василькин 2011-04-20 в 14:48Спам
спасибо =)
4
Александр Ильин 2011-04-20 в 17:22Спам
Супер вещь, применить можно)
4
Оксана Чудина 2011-04-20 в 17:27Спам
Что очень хорошо, слайдер прост и функционален, подойдет всегда и везде smile
3
Василий Петров 2011-05-06 в 15:01Спам
а можно заместо ссылок туда фотографии вставить?
2
sima 2011-05-06 в 16:35Спам
"Из этой готовой функции можно сделать не только перелистывание новостей, можно сделать слайдшоу из фотографий."
1
Василий Петров 2011-05-06 в 22:10Спам
спасибо
2
Чтобы оставить комментарий или отзыв под этой публикацией, войдите.