我在jQuery中有一个滑块,我希望它每隔三秒自动旋转一次。我可以让它在点击时工作,或者幻灯片上的点是旋转它旋转但我不能让它自动旋转。
我尝试添加
setInterval(function(){
$('.nextSlide').click()
},3000)
这是我控制幻灯片更改的jQqery代码:
nextSlide : function(){
if (dcs.currentSlideIndex>=dcs.slideCount-1 || inAnimation){
return false
}
var self=this,
cHeight=dcs.carouselHeight;
inAnimation=true;
dcs.currentSlideIndex++;
if (dcs.currentSlideIndex+1==dcs.slideCount)
dcs.nextButton.fadeOut();
dcs.prevButton.fadeIn();
self.changeSlide(dcs.currentSlideIndex);
},
prevSlide : function(){
if (dcs.currentSlideIndex<=0 || inAnimation){
return false
}
var self=this,
cHeight=dcs.carouselHeight;
inAnimation=true;
dcs.currentSlideIndex--;
if (dcs.currentSlideIndex==0){
//hide the nexr arrow
dcs.prevButton.fadeOut();
}
dcs.nextButton.fadeIn();
self.changeSlide(dcs.currentSlideIndex);
},
gotoSlide:function(sIndex){
var self=this,
cHeight=dcs.carouselHeight;
inAnimation=true;
self.changeSlide(sIndex);
},
changeSlide:function(sIndex){
var self=this,
cHeight=dcs.carouselHeight;
self.$elem.trigger('start-change');
self.updateCounter(dcs.currentSlideIndex);
(new TimelineLite({onComplete:function(){
inAnimation=false;
self.$elem.trigger('end-change');
}
}))
.to(dcs.rightWrapper,dcs.rightSideDuration,{y:-dcs.rightDirectionSign*sIndex*cHeight,ease:Power4.easeOut})
.to(dcs.leftWrapper,dcs.leftSideDuration,{y:-dcs.leftDirectionSign*sIndex*cHeight,ease:Power4.easeOut},'-='+dcs.rightSideDuration);
},
updateCounter : function(currentSlideIndex){
dcs.counterCurrent.html(currentSlideIndex+1);
},
bindUIActions: function(){
var self = this;
dcs.nextButton.on('click',function(){
self.nextSlide();
})
dcs.prevButton.on('click',function(){
self.prevSlide();
})
$(window).on('resize',function(){
self.update();
});
if (dcs.mouse){
self.scrollControll();
}
if (dcs.keyboard){
self.keyboardControll();
}
if (dcs.touchSwipe){
self.touchControll();
}
if (dcs.bulletControll){
self.bulletControll();
}
},
scrollControll:function(){
var self=this;
self.$elem.on('DOMMouseScroll mousewheel', function (e) {
if(e.originalEvent.detail > 0 || e.originalEvent.wheelDelta < 0) {
self.nextSlide();
} else {
self.prevSlide();
}
});
},
keyboardControll:function(){
var self=this;
$(document).keydown(function(e) {
switch(e.which) {
case 38: // up
self.prevSlide();
break;
case 40: // down
self.nextSlide();
break;
default: return;
}
e.preventDefault();
});
},
touchControll:function(){
var self=this;
self.$elem.swipe({
swipe:function(event, direction, distance) {
if (direction=='down'){
self.nextSlide();
}else if (direction=='up'){
self.prevSlide();
}
}
});
},