Понедельник, 19.11.2018, 21:00
Главная Регистрация RSS
Приветствую Вас, Гость
НОВОЕ НА ФОРУМЕ
НОВЫЕ КОМЕНТАРИИ
Статистика

Онлайн всего: 1
Гостей: 1
Пользователей: 0

Нас сегодня посетили :
mytorrento
Поиск
Главная » Файлы » СКРИПТЫ ДЛЯ UCOZ » СЛАЙДЕР УКОЗ

Резиновый слайдер FlexSlider

Резиновый слайдер FlexSlider


Слайдер с адаптивными свойствами будет изменять свои размеры относительно свободного пространства окна. Изначальные размеры изображений не имеют значения и будут масштабироваться согласно устанавливаемым размерам по месту. FlexSlider может использоваться как слайдер для видео, применяя в качестве слайдов видео проигрыватели. Резиновый слайдер имеет большое количество настроек, при помощи которых Вы сможете настроить воспроизведение на своё усмотрение. По умолчанию, готовый код для установки полностью настроен, Вам останется поместить его в требуемое место, изменить путь к используемым слайдам и радовать посетителей своими творениями




Код

 

<script type="text/javascript" src="//s36.ucoz.net/src/jquery-1.7.2.js"></script></p> <link href="//delaisait.ucoz.ru/script/sluder/2014/flexslider/flexslider.css" media="all" rel="stylesheet" type="text/css" /> <link href="//delaisait.ucoz.ru/script/sluder/2014/flexslider/public.css" media="all" rel="stylesheet" type="text/css" /><script type='text/javascript' src='//delaisait.ucoz.ru/script/sluder/2014/flexslider/jquery.flexslider-min.js'></script> <style type="text/css">#metaslider.flexslider li { margin-right: 5px !important; } #ds-flexslider { max-width:600px; margin:0 auto; } </style> <div class="metaslider metaslider-flex" id="ds-flexslider"> <div id="metaslider_container"> <div class="flexslider" id="metaslider"> <ul class="slides">  <li style="display: none;"><a href="#" target="_blank"><img alt="Девушка Эльф" src="//delaisait.ucoz.ru/script/sluder/2014/flexslider/947677767.jpg" /> </a>  <div class="caption-wrap">  <div class="caption">Девушка Эльф</div>  </div>  </li>  <li style="display: none;"><a href="#" target="_blank"><img alt="Девушка в чёрном" src="//delaisait.ucoz.ru/script/sluder/2014/flexslider/769128589.jpg" /> </a>  <div class="caption-wrap">  <div class="caption">Девушка в чёрном</div>  </div>  </li>  <li style="display: none;"><a href="#" target="_blank"><img alt="Девушка в красном" src="//delaisait.ucoz.ru/script/sluder/2014/flexslider/378189360.jpg" /> </a>  <div class="caption-wrap">  <div class="caption">Девушка в красном</div>  </div>  </li>  <li style="display: none;"><a href="#" target="_blank"><img alt="Девушка в свадебном платье" src="//delaisait.ucoz.ru/script/sluder/2014/flexslider/84040181.jpg" /> </a>  <div class="caption-wrap">  <div class="caption">Девушка в свадебном платье</div>  </div>  </li>  <li style="display: none;"><a href="#" target="_blank"><img alt="Девушка с бабочкой" src="//delaisait.ucoz.ru/script/sluder/2014/flexslider/572570776.jpg" /> </a>  <div class="caption-wrap">  <div class="caption">Девушка с бабочкой</div>  </div>  </li> </ul> </div> </div> </div> <script> $(document).ready(function () { $('#metaslider').flexslider({ slideshowSpeed:3000, animation:'slide', controlNav:true, directionNav:true, pauseOnHover:true, direction:'horizontal', reverse:false, animationSpeed:600, prevText:"<", nextText:">", easing:"linear", slideshow:true, itemWidth:600, itemMargin:5, useCSS:true }); }); </script>  <p>



Проверте код в ректоре ниже



Проверить код

Похожие материалы:

Категория: СЛАЙДЕР УКОЗ | Добавил: mytorrento | Теги: СЛАЙДЕР УКОЗ, Слайдер
Просмотров: 1119 | Загрузок: 0 | Рейтинг: 0.0/0
Всего комментариев: 0
Имя *:
Email *:
Все смайлы
Код *: