Простой адаптивный слайдер на jquery

Это адаптивный слайдер, который мне пришлось сделать самому. Не смог найти слайдер, который мне нужен, хотя честно признаюсь я плохо искал. И так как я уже его сделал, подумал, что он может кому-то пригодиться. Но сразу скажу, что сейчас есть в сто раз лучше слайдеры к тому же для touch устройств. А вот мой не приспособлен для этого, он простой.
Одним словом, я просто не хотел грузить сайт с мешком библиотек ради одного слайдера.

Подключение

Подключаем стили и скрипт слайдера:

<link href="css/prosto.slider.css" rel="stylesheet">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<script src="js/prosto.slider.js"></script>
 
Html структура слайдера:
<!-- Slider start -->
<div class="slider">
<!-- Изображения слайдера -->
<ul>
<li class="active"><img src="img/slide_1.jpg" alt=""></li>
<li><img src="img/slide_2.jpg" alt=""></li>
<li><img src="img/slide_3.jpg" alt=""></li>
</ul>
<!-- Кнопки назад вперёд -->
<a href="#" class="prev"></a>
<a href="#" class="next"></a>
</div>
<ul class="for_slider">
<li class="active_k">
<h2>Заголовок первого слайда</h2>
<span>Описание...</span>
</li>
<li>
<h2>Заголовок второго слайда</h2>
<span>Описание...</span>
</li>
<li>
<h2>Заголовок третьего слайда</h2>
<span>Описание...</span>
</li>
</ul>
<!-- Slider end -->
Скрипты я не буду писать тут. Скачивайте и смотрите что внутри. Сделано на быструю руку, строго не судите.

Работа слайдера

Слайдер адаптивный. Может содержать в себе как картинку так и видео например с YouTube, которое подстраивается под размеры слайдера. А так же заголовок и описание, либо другие элементы.
К сожалению нет автоматической прокрутки, так как не было такой задачи.
 
В общем много слов, лучше сами посмотрите...

 
Скачать файл: prosto-slider.rar [773,23 Kb] (cкачиваний: 328)
Автор: Kylaksizov

Комментарии ( 1 )

  1. 0

    nariman

    на этом сайте есть красивый слайдер relaxed
    10 ноября 2016 22:23 Ответить


Отправить

В корзине: 0 шт.

на сумму: 0

Всего: 0

Оформить заказ Очистить корзину