jquery内容滑块需要自动播放

jquery content slider needs autoplay

本文关键字:自动播放 jquery      更新时间:2024-02-13

我有这个内容滑块,我需要它像幻灯片一样,我需要自动播放

$(document).ready(function() {
$('.poveznicaDiv').click(function(){
    var broj = $(this).attr('id');
    broj = broj.split('ca');
    broj = parseInt(broj[1]);       
    $('#maskaSadrzaja').animate({'left': '-'+ 500*(broj-1) +'px'}, 'slow');
});
});

忽略克罗地亚语:D 上的id和类名

所以这很好用,但我需要自动播放

我试过这个:

slideShow();
function slideShow(){
    var i = 0;
    $('#maskaSadrzaja').animate({'left': '-'+ 500*(i) +'px'}, 'slow');
    broj++;
    // alert(i);
    if(i>5){
        i=0;
    }   
    setTimeout(slideShow, 1000);
};

但是不起作用

我怎么能让它自动播放?

编辑

所以我试了别的class为.poveznicaDiv的div也有一个id,类似于poveznica1、poveznica 2等

所以我试着添加一个点击的功能

类似这样的东西:

i=1;
function autoplay() {
$('#poveznica'+i).click();
i++;
setTimeout(autoplay, 1000);
}

为什么这不起作用?我已经把它放在.ready中,并调用了函数(autoplay;)。请帮助

编辑

我的滑块(以及html和css)与此滑块几乎相同http://www.webdeveloperjuice.com/2010/01/12/lightest-jquery-content-slider-ever-made-380-bytes/

我怎么能让它自动旋转?

您的代码中没有递增i,您还必须将其传递给函数调用,因为它不是全局变量。

var slideShow = function(i){
  $('#maskaSadrzaja').animate({
    'left': '-' + 500*(i) + 'px'
  }, 'slow');
  broj++;
  if(i>5){
    i=0;
  }   
  setTimeout(function(){
    slideShow(i+1);
  }, 1000);
};
slideShow(0);

把它放在Document.Ready中,或者像这样简称

$(function() {       
var i = 0;
$('#maskaSadrzaja').animate({'left': '-'+ 500*(i) +'px'}, 'slow');
broj++;
// alert(i);
if(i>5){
    i=0;
}   
setTimeout(slideShow, 1000);

});