Categories

Слайдер «Faded» (с эффектом растворения)

Template-help.com Team Ноябрь 15, 2010
Rating: 5.0/5. From 2 votes.
Please wait...
Это скрипт слайдера, который создает эффект затухания во время смены слайдов. Этот слайдер можно использовать не только для картинок, но также и для другого контента. Инструкции по полной установке и настройке слайдера Вы найдете, перейдя по этой ссылке.

JavaScript
Чтобы скрипт работал, в index-#.html файле со слайдером должны быть строки HTML кода для того, чтобы добавить jquery.faded.js скрипт и jQuery фреймворк:

В файле index-#.html в области index-#.html (или прямо перед закрывающим тегом </body>) должны быть вот эти строки кода для инициализации функциональности скрипта с основными значениями:

Для инициализации этого скрипта используется <div> элемент с индентификатором id #faded. Атрибуты скрипта определяют такие значения:

•    speed: 300 – задает скорость анимации;
•    crossfade: false – постепенное проявление контента;
•    bigtarget: false – нажать на контент для перехода к следующему слайду;
•    loading: false – только для изображений, проверяет загружена ли картинка перед показом;
•    autoheight: false – автокорректировка высоты;
•    pagination: «pagination» – устанавливает значение на true и имя класса для нумерации страниц; установите на false для отключения этой функции;
•    autopagination: true – установите на true , чтобы автоматически создавать нумерацию страниц;
•    nextbtn: «next» – класс кнопки next (следующий);
•    prevbtn: «prev» – класс кнопки previous (предыдущий);
•    loadingimg: false – расположение загрузки изображений (напр. /img/loading.gif) если используете загрузку;
•    autoplay: false – автоматическое проигрывание контента (установите четное число для значения true); также установите временный интервал (возьмите 1000 для 1 секунды);
•    autorestart: false – автоматический перезапуск, если остановилось автоматическое воспроизведение (установите четное число для значения true); также установите временный интервал (возьмите 1000 для 1 секунды);
•    random: false – истановите на true для случайного порядка.

HTML
Ниже этот скрипт представлен в HTML (для изображений):

Для добавления нового слайда просто добавьте картинку (<img> тег):



Ниже скрипт представлен в HTML (для разного контента):

Для того, чтобы добавить слайд Вам просто добавьте элемент маркированного списка (<li> тег):



CSS
Скрипт связанных стилей находится в файле style.css. Вам нужно изменить эти стили:
Эта запись была размещена в Слайдер и помечена как jQuery, slider. Добавьте в закладки постоянную ссылку.

Submit a ticket

Если вы не смогли найти подходящее решение проблемы, пожалуйста воспользуйтесь следующей ссылкой, чтобы отправить запрос команде технической поддержки.
Отправить запросВы получите ответ в течение 24 часов