Многие веб-мастера в дизайне свойх сайтов используют слайдеры. И правда, смотрятся они довольно симпатично, да и место можно сэкономить.
Конечно, в сети достаточно много слайдеров, однако уникальность этого в простоте установки и одновременно в широких возможностях.
Вот типичный пример работы слайдера:
В данном случае, работает автопрокрутка, с заданной скоростью и без описания картинок. Также установлен эффект слайдов.
Теперь о том, как поставить слайдер на свой сайт:
Шаг 1: , и скачать архив со скриптом(кнопка для скачивания внизу страницы слева)
Шаг 2 : извлечь скачанный архив и положить файлы в корень своего сайта. Можно также переименовать папку. По умолчанию, она называется lifedraft-dhonishow-210c4fb. Для простоты я переименовал ее в slide. В итоге у меня получилась папка slide, внутри которой расположены 3 папки(lib, src и tests) и 3 файла.
Шаг 3: необходимо подключить нужные библиотеки и стили к странице. В моем случае, это будет выглядеть так:
Обязательно следите, чтобы пути к файлам были прописаны правильно, иначе ничего работать не будет. Также, для тех, кто не знает, указанный выше код, нужно вставить в голову страницы сайта, т.е. между открывающим и закрывающим тегами <head></head> .
Опять же, следите за тем, чтобы пути к картинкам были прописаны правильно. Также, обязательно заполняйте атрибут ALT изображений, т.к. эта информация используется для описания картинок по умолчанию.
О всех эффектах, которые можно достичь с помощью этого слайдера, читайте на сайте автора. Те, кто не силен в английском, могут почитать автоматически переведенную с помощью переводчика Google версию документации .
Главное нужно понять, что все настройки осуществляются через эту строку(это ее стандартный вид):
<div class="dhonishow">
Если Вам нужно допустим добавить автопрокрутку, мы просто через пробел пишем необходимую фразу(изначально подсмотрев ее в документации)
<div class="dhonishow autoplay_2dot5">
А если вдруг захотелось еще и эффект слайдов добавить, опять же через пробел пишем необходимое правило.
Если хотите, то такой слайдер можно использовать, например для рекламы. Т.е. сначала подготовить 5 рекламных изображений, сделать для каждого ссылку и поместить в слайдер. Поставить автопрокрутку и скрыть все описания.
Таким образом, будут меняться изображения и ссылки, на которые ведут эти изображения. И пользователь, будет видеть как-бы постоянно меняющуюся рекламу. Если его что-то заинтересует, он может кликнуть по изображению, и перейти именно по той ссылке, которая прописана в конкретном изображении.
