Когда часто приходиться ставить слайдеры на сайт парой хочется найти несколько вариантов, которые подходили бы к большинству проектов. Никто не хочет возиться с подключением и тратить время на изменение CSS стилей. ResponsiveSlides в переводе с английского отзывчивые слайды могут стать одним из таких вариантов.
При работе с этим плагином, можно отметить три вещи:
- Простоту интеграция в HTML страницу;
- Адаптивность к разным расширениям;
- Много режимность, плагин легко настраивается под различные варианты работы.
Установка очень проста, и с этим вряд ли у кого возникнут проблемы. Сначала как обычно подключаем стили и скрипты плагина:
<link href="responsiveslides.css" rel="stylesheet" />
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<script src="responsiveslides.min.js" type="text/javascript"></script>
Теперь добавим HTML разметку на страницу:
<ul class="rslides">
<li><img src="1.jpg" alt="image"></li>
<li><img src="2.jpg" alt="image"></li>
<li><img src="3.jpg" alt="image"></li>
</ul>
После всех этих действий останется только вызвать слайд шоу:
$(function(){
$(".rslides").responsiveSlides();
});
Если необходимо настроить скорость, паузы, порядок слайдов, то можно воспользоваться опциями:
$(".rslides").responsiveSlides({
auto: true,
speed: 500,
timeout: 4000,
pager: false,
nav: false,
random: false,
pause: false,
pauseControls: true,
prevText: "Previous",
nextText: "Next",
maxwidth: "",
navContainer: "",
manualControls: "",
namespace: "rslides",
before: function(){},
after: function(){}
});
Как видно все опции поняты и не нуждаются в переводе. Так же этот плагин частенько обновляется на сайте разработчиков.