Jquery如何设置间隔

我用jquery做幻灯片放映

我如何设置两个function之间的间隔

例如：

$('#slide').css('background-image', 'url(1.jpg)'); //sleep 5000 ms $('#slide').css('background-image', 'url(2.jpg)'); 

Answer 1

 var counter= 0, imgs = ['1.jpg', '2.jpg']; $('#slide').css('background-image', 'url('+ imgs[counter] +')'); setInterval(function(){ counter++; if(counter > imgs.length-1) counter = 0; $('#slide').css('background-image', 'url('+ imgs[counter] +')'); }, 1000); 

Answer 2

你的代码非常低效。 在需要再次搜索#slide元素后，您将从DOM获得#slide和一行。 获取元素并将其保存在变量中更快：

 $('#slide').css('background-image', 'url(1.jpg)').css('background-image', 'url(2.jpg)'); 

暂停可以通过.delay( time )方法完成：

 $('#slide').css('background-image', 'url(1.jpg)') .delay(1000) .css('background-image', 'url(2.jpg)'); // 1000 ms = 1 s 

---

感谢Yoshi， .delay仅适用于.animate 。 所以我用setTimeout尝试了它：

 var foo = $('#foo') foo.css('background', '#c33'); setTimeout( function() { foo.css('background', '#33c'); }, 2000); // 2000ms = 1s 

实例： http ： //jsfiddle.net/fmzZ6/