Слайдер DhoniShow

Горизонтально-вертикальный слайдер, в котором можно сделать авто-прокрутку и изменить положение полосы описания или вовсе ее убрать.

Чтобы вы поняли, нужно Вам это или нет, сразу приведу живой пример.

Отлично выглядит, кроме того есть множество опций: изображения могут двигаться вертикально, можно сделать авто-прокрутку, можно изменить положение полосы описания или вовсе ее убрать.

Установка и настройка

Для работы этого слайдшоу нам потребуются jQuery, плагин к Dhonishow и немного картинок.сайт источник http://yapro.ru Sat Jan 23 2010 23:32:39 GMT+0300

Сначало подключаем нужные библиотеки и стили к страничке.

<link rel="stylesheet" href="src/dhonishow.css" type="text/css" media="screen" />
<script src="lib/jquery-1.2.6.min.js" type="text/javascript"></script>
<script src="src/jquery.dhonishow.js" type="text/javascript"></script>

Теперь создадим блок с картинками:

<div>
<img src="img/rocker.jpg" alt="Rocker" />
<img src="img/rocker2.jpg" alt="Rocker 2" />
...
</div>

Описания изображений берутся из их alt атрибута, так что не стоит им пренебригать.

Для настройки же, вы должны изменять class вашего блока с картинками, полную документацию вы найдете на сайте автора.

Чтобы заработало под IE6, в CSS-файле нужно убрать на левую и на правую кнопку:

* html .dhonishow .dhonishow-previous-button {
background-image: none;
}

Пример в отдельном окне »

Оцени публикацию:
  • 6,28
Оценили человек: 6

Похожие статьи:

Справочники и учебники:


Комментарии посетителей:
  • А в опере этот слайдер:(
    Это можно как-то исправить?
    07 июня 2013, 17:22 коммент полезен : 0 # Mary
Предложения и пожелания:
Ваше имя:
Ваш E-mail:
Введите изображенные цифры:
Captcha
Главная
X

youtube.com/watch?v=7hFivbgIEqk

При полном или частичном использовании материалов данного сайта, ссылка на сайт "yapro.ru" обязательна как на источник информации.
Автоматический импорт материалов и информации с сайта запрещен.
Copyrights © 2007 - 2017 YaPro.Ru

Главная » Веб-мастеру » JavaScript »