FlexSlider / Слайдеры / Сниппеты Bootstrap | BootstrapТема

1
2
3
4
5

Версия: v1.0.1

Каталог: Сниппеты Bootstrap

Категория: Слайдеры

Bootstrap: 3, 4, 5

Для CMS: HTML, Drupal, Joomla, uCoz, WordPress, Magento, OpenCart, PrestaShop, Shopify, WHMCS

Язык: Английский

Вес файла: 2.07 Mb

Уникальный ID: 1521

Количество символов:

Посмотрели: 8372 раз

Помощь: установка & настройка

Прикреплён файл №2: /stuff/0-0-0-1521-20

Скачали бесплатно: 415 раз

Прокомментировали: 0 раз

Рейтинг: 3.9 / 5 - 9 голосов

Тип лицензии: CC BY 4.0

Авторство: bootstraptema.ru

Информация: Пользователям

Информация: Правообладателям

Теги: thumbnail, адаптивный, Snippet, flexslider, сниппет, Bootstrap, Responsive, html, Slider, слайдер

Поделился: BootstrapТема

Добавлено: 2016-12-13 в 12:47

Метка: 1643654371

⇄ ⇅

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" />
<link rel="stylesheet" href="https://bootstraptema.ru/snippets/slider/2016/flexslider/flexslider.css"/>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<script type="text/javascript" src="https://bootstraptema.ru/snippets/slider/2016/flexslider/jquery.flexslider.js"></script>
<script type="text/javascript" src="https://bootstraptema.ru/snippets/slider/2016/flexslider/modernizr.js"></script>
<script type="text/javascript" src="https://bootstraptema.ru/snippets/slider/2016/flexslider/jquery.mousewheel.js"></script>

<script>
$(window).load(function() {
 $('.flexslider').flexslider({
 animation: "slide",
 controlNav: "thumbnails"
 });
});
</script>

<div class="container">
 <div class="row">
 <div class="col-md-12">

<div class="flexslider">
 <ul class="slides">
 <li data-thumb="https://murchim.ru/_sf/32/92328452.jpg">
 <img src="https://murchim.ru/_sf/32/92328452.jpg" />
 </li>
 <li data-thumb="https://murchim.ru/_sf/32/92328452.jpg">
 <img src="https://murchim.ru/_sf/32/92328452.jpg" />
 </li>
 <li data-thumb="https://murchim.ru/_sf/32/92328452.jpg">
 <img src="https://murchim.ru/_sf/32/92328452.jpg" />
 </li>
 <li data-thumb="https://murchim.ru/_sf/32/92328452.jpg">
 <img src="https://murchim.ru/_sf/32/92328452.jpg" />
 </li>
 </ul>
 </div>

</div>
</div>
</div>