Добрый день! подскажите что дописать что бы слайдер автоматически менял слайды? Есть код:
$(document).ready(function() {
var sliders = $(".slider");
var rightArrow = sliders.children('.right');
var leftArrow = sliders.children('.left');
initSliders(sliders)
var touchstartX = 0;
var touchstartY = 0;
var touchendX = 0;
var touchendY = 0;
var gestureZone = document.getElementsByClassName('slider');
for(var i=0;i<gestureZone.length;i++){
gestureZone[i].addEventListener('touchstart', function(event) {
touchstartX = event.changedTouches[0].screenX;
touchstartY = event.changedTouches[0].screenY;
}, false);
gestureZone[i].addEventListener('touchend', function(event) {
touchendX = event.changedTouches[0].screenX;
touchendY = event.changedTouches[0].screenY;
handleGesture(this);
}, false);
}
function handleGesture(slideChildren) {
if (touchendX+45 < touchstartX) {
moveSlideLeft(slideChildren.getElementsByClassName('right'));
}
if (touchendX > touchstartX + 45) {
moveSlideLeft(slideChildren.getElementsByClassName('left'));
}
}
rightArrow.on('click',function(){
moveSlideRight(this);
})
leftArrow.on('click',function(){
moveSlideLeft(this);
})
function initSliders(sliders){
sliders.children('.slide').first().addClass('current-slide');
sliders.children('.slide').hide();
var slideInfo = {}
for(var i=0;i<sliders.length;i++){
var showSlide = $(sliders[i]).children('.slide').first().html();
$(sliders[i]).append('<div class="showSlides">'+showSlide+'</div>');
}
}
function scrollSlide(slideToShow,currentSlide){
$(slideToShow).children('.slider-text').stop().animate({opacity:0},450,function(){
$(slideToShow).children('.slider-text').children('h5').html( $(currentSlide).children('.slider-text').children('h5').html());
$(slideToShow).children('.slider-text').children('.subheading').html( $(currentSlide).children('.slider-text').children('.subheading').html());
$(slideToShow).children('.slider-text').children('.description-text').html( $(currentSlide).children('.slider-text').children('.description-text').html());
$(this).animate({opacity:1},450);
})
if( $('.slider').find('.review-soc').length !== 0 ){
$(slideToShow).find('.review-soc').stop().animate({opacity:0},450,function(){
$(this).html( $(currentSlide).find('.review-soc').html());
$(this).animate({opacity:1},450);
})
}
$(slideToShow).children('.slider-image').find('img').stop().animate({ borderSpacing: 90}, {
step: function(now,fx) {
$(this).css('-webkit-transform','rotatey('+now+'deg)');
$(this).css('-moz-transform','rotatey('+now+'deg)');
$(this).css('transform','rotatey('+now+'deg)');
},
duration:'900',
complete:function(){
$(this).attr('src', $(currentSlide).children('.slider-image').find('img').attr('src'));
$(this).attr('alt', $(currentSlide).children('.slider-image').find('img').attr('alt'));
$(this).animate({ borderSpacing: 0 }, {
step: function(now,fx) {
$(this).css('-webkit-transform','rotatey('+now+'deg)');
$(this).css('-moz-transform','rotatey('+now+'deg)');
$(this).css('transform','rotatey('+now+'deg)');
},
duration:'900'
})
}
});
}
function moveSlideRight(arrow){
var slideToShow = $(arrow).siblings('.showSlides');
var currentSlide = $(arrow).siblings('.current-slide');
var nextSlide = $(arrow).siblings('.currentSlide').next();
if($(currentSlide).next().hasClass('showSlides')){
$(currentSlide).removeClass('current-slide');
$(currentSlide).parent('.slider').children('.slide').first().addClass('current-slide');
currentSlide = $(currentSlide).parent('.slider').children('.slide').first();
scrollSlide($(slideToShow), $(currentSlide));
}else{
$(currentSlide).next().addClass('current-slide');
$(currentSlide).removeClass('current-slide');
currentSlide = $(currentSlide).next();
scrollSlide($(slideToShow), $(currentSlide));
}
}
function moveSlideLeft(arrow){
var slideToShow = $(arrow).siblings('.showSlides');
var currentSlide = $(arrow).siblings('.current-slide');
var nextSlide = $(arrow).siblings('.currentSlide').next();
if($(currentSlide).prev().hasClass('slider-control')){
$(currentSlide).removeClass('current-slide');
$(currentSlide).siblings('.showSlides').prev().addClass('current-slide');
currentSlide = $(currentSlide).siblings('.showSlides').prev();
scrollSlide($(slideToShow), $(currentSlide));
}else{
$(currentSlide).prev().addClass('current-slide');
$(currentSlide).removeClass('current-slide');
currentSlide = $(currentSlide).prev();
scrollSlide($(slideToShow), $(currentSlide));
}
}
});
Меняет по клику на стрелу, пытаюсь заставить вызывать функцию каждые 5 сек, но не хочет работать
window.setInterval(function(){
moveSlideRight(this);
}, 5000);
Подскажите что нужно ему прописать...