jQuery的设置间隔

Question

林制作幻灯片使用jQuery

如何我可以在两个功能

例如之间设置间隔：

$('#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，并获得一行。它的速度更快，以获得元素，并将其保存在一个变种AR东西：

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

和Pause可以通过.delay(time)方法来完成：

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

---

感谢耀西，.delay只有作品与.animate。所以我setTimeout试了一下：

var foo = $('#foo') 

foo.css('background', '#c33'); 

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

活生生的例子：http://jsfiddle.net/fmzZ6/