超困難的addClass延遲功能瓦特/差異定時間隔

總新手在這裏。我有一些列表項。我需要爲每個列表項添加一個'.go'類，每次一個，按預定的時間塊分隔開。（每一段時間將會有不同的持續時間）。超困難的addClass延遲功能瓦特/差異定時間隔

例如：

腳本添加一個 '去' 級到第一（LI）
的 '去' 類持有上（LI），用於精確地4.5秒。
一次4.5秒之後，該腳本將刪除當前列表項
腳本移動到下一個（LI）的「去」類，並添加一個「去」類
了」。去'課持有這個（李）1.5秒。
一次1.5秒之後，該腳本將刪除當前列表項
然後循環重複的「去」級，直到它已通過所有的列表項

腳本循環我一直在努力不起作用。它立即將所有類添加到（li）中。然後他們在不同的時間間隔消失。相反，我需要以不同的時間間隔添加課程。這裏有一個例子：http://jsfiddle.net/bM6uY/8/

      <ul> 
          <li>hello</li> 
          <li>World!</li> 
          <li>Foo</li> 
          <li>Bar</li> 
         </ul>

  $(function() { 
      $('ul li:nth-child(1)').addClass("go") 
        .delay(4500) 
        .queue(function() { 
         $(this).removeClass("go"); 
         $(this).dequeue(); 
        }); 


      $('ul li:nth-child(2)').addClass("go") 
        .delay(1500) 
        .queue(function() { 
         $(this).removeClass("go"); 
         $(this).dequeue(); 
        });  


      $('ul li:nth-child(3)').addClass("go") 
        .delay(500) 
        .queue(function() { 
         $(this).removeClass("go"); 
         $(this).dequeue(); 
        });  


      $('ul li:nth-child(4)').addClass("go") 
        .delay(5000) 
        .queue(function() { 
         $(this).removeClass("go"); 
         $(this).dequeue(); 
        });        
      });

來源

2011-02-10 Bizarro Zeldman

怎麼是這樣的：

$(function() { 
    var index = 0; 
    var length = $("ul").children().length; 
    var delays = [ 
      500, 
      1500, 
      500, 
      5000 
    ]; 

    function delayNext() 
    { 
     setTimeout(function() { 
      $("ul li:eq(" + index + ")").addClass("go").siblings().removeClass("go"); 
      index++; 

      if (index == length) 
       index = 0; 

      delayNext(); 
     }, delays[index]); 
    } 

    delayNext(); 
});

http://jsfiddle.net/rfvgyhn/9VL4r/2/

來源

2011-02-10 21:30:04 Chris

這就是真正的接近，但我將如何添加多個/不同的延遲值？而不是他們具有完全相同的延遲量？ – 2011-02-10 21:33:31

很酷，但是如何爲每個週期分配不同的延遲？ – 2011-02-10 21:43:24

我換了4個隊列，像下面這樣：

$('ul li:nth-child(1)').delay(4500) 
         .queue(function() { 
          $('ul li').removeClass("go"); 
          $(this).addClass("go"); 
          $(this).dequeue(); 
         });

這裏的整個事情：http://jsfiddle.net/ChrisMH/bM6uY/18/

來源

2011-02-10 21:34:02

超困難的addClass延遲功能瓦特/差異定時間隔

回答

相關問題