#multiSlide 0.2.1
##jQuery плагин для постраничного скроллинга
##Основные характеристики
###Поддержка браузеров:
- IE7+
- Firefox
- Chrome
- Safari,
- mobile browsers
###Поведение слайдера
- Если скроллить, находясь в области слайдов, слайды будут переключаться вверх-вниз соответственно
- Если скроллить вне области слайдов или в области пагинации - слайды переключаться не будут
- При клике на пагинацию происходит скроллирование к соответствующему слайду
##Установка
###Подключить требуемые файлы
<!-- jQuery library -->
<script src="lib/jquery-1.10.2.min.js"></script>
<!--Animate Enhanced Plugin (http://playground.benbarnett.net/jquery-animate-enhanced/)-->
<script src="lib/jquery.animate-enhanced.js"></script>
<!--jQuery Easing Plugin (http://gsgd.co.uk/sandbox/jquery/easing/)-->
<script src="lib/jquery.easing.1.3.min.js"></script>
<!--jQuery Mousewheel Plugin (http://plugins.jquery.com/mousewheel/)-->
<script src="lib/jquery.mousewheel.js"></script>
<!-- MultiSlide css file -->
<link rel="stylesheet" href="multiSlide.css">
<!-- MultiSlide javascript file -->
<script src="multiSlide.js"></script>###Создать HTML разметку
<div class="viewport-block">
<div class="view-slide active">slide1</div>
<div class="view-slide">slide2</div>
<div class="view-slide">slide3</div>
</div>###Вызвать плагин
$(document).ready(function(){
$('.viewport-block').multiSlide();
});##Параметры
###Базовые slideTime - Время переключения слайдов
default: 700
var multiSlide = $(".viewport-block").multiSlide({
slideTime: 1000
});easingType - тип анимации (или функция Безье)
default: 'easeOutExpo'
options: type or Bezier function
var multiSlide = $(".viewport-block").multiSlide({
easingType: 'easeOutExpo'
});activeSlideCss - класс для активного слайда
default: 'active'
var multiSlide = $(".viewport-block").multiSlide({
activeSlideCss: 'active'
});paging - разметка пагинации
default: '.lister li'
var multiSlide = $(".viewport-block").multiSlide({
paging: '.view-slide-nav .nav-item'
});###CallBacks
beforeShow - срабатывает перед показом нового слайда
var multiSlide = $(".viewport-block").multiSlide({
beforeShow: function(currentSlide, newIndex){
}
});afterShow - срабатывает после показа нового слайда
var multiSlide = $(".viewport-block").multiSlide({
afterShow: function(newIndex){
}
});###Public methods switchSlideNext - переключиться на следующий слайд
var multiSlide = $(".viewport-block").multiSlide();
multiSlide.switchSlideNext();switchSlidePrev - переключиться на предыдущий слайд
var multiSlide = $(".viewport-block").multiSlide();
multiSlide.switchSlidePrev();switchSlideTo(n) - переключиться к слайду под номером n (нумерация с 0)
var multiSlide = $(".viewport-block").multiSlide();
multiSlide.switchSlideTo(0); //к первому слайдуscrollOff - отключить переключение слайдов по mousewheel и swipe (по умолчанию включено)
var multiSlide = $(".viewport-block").multiSlide();
multiSlide.scrollOff();scrollOn - переключение слайдов по mousewheel и swipe
var multiSlide = $(".viewport-block").multiSlide();
multiSlide.scrollOn();