在jQuery中使用for循环缓存字符串

Question

我对jQuery编程颇为陌生，所以请耐心等待。

我想缓存一个列表，我已经在我的js文件的底部，以便页面运行更平滑。

我已经准备名单看起来就像这样：

$(document).ready(function() { 

    hover($('#rim-1'), 900); 
    hover($('#rim-2'), 800); 
    hover($('#rim-3'), 1000); 
    hover($('#rim-4'), 900); 
    hover($('#rim-5'), 800); 
    hover($('#rim-6'), 1000); 
    hover($('#rim-7'), 900); 
    hover($('#rim-8'), 800); 
    hover($('#rim-9'), 1000); 
    hover($('#rim-10'), 900); 
    hover($('#rim-11'), 800); 
    hover($('#rim-12'), 1000); 
    shadow($('#shadow-1'), 900); 
    shadow($('#shadow-2'), 800); 
    shadow($('#shadow-3'), 1000); 
    shadow($('#shadow-4'), 900); 
    shadow($('#shadow-5'), 800); 
    shadow($('#shadow-6'), 1000); 
    shadow($('#shadow-7'), 900); 
    shadow($('#shadow-8'), 800); 
    shadow($('#shadow-9'), 1000); 
    shadow($('#shadow-10'), 900); 
    shadow($('#shadow-11'), 800); 
    shadow($('#shadow-12'), 1000); 
} 

我想成立一​​个for循环，这样不仅“#rim”和“#shadow”获得递增的数字，而且他们的速度由100

我试图建立递增看起来像：

var hover = $("#floating-rim-container").find(".floating-rim-wrapper"); 
for (i=0; i<6; i++) { 
    var speed = speed + 100; 
} 

当然，这还远没有结束。我只是不确定我应该如何设置这个多方面的命令。我的理论背后是，也许我可以将它们用于所有不同语句的包装。在html中，它们看起来像：

<div id="floating-rim-container"> 

      <a href="#"> 
       <img src="images/rim-middle.png" class="floating-rim-wrapper" id="rim-7"> 
      </a>   
      <a href="#"> 
       <img src="images/rim-middle.png" class="floating-rim-wrapper" id="rim-8"> 
      </a>   
      <a href="#"> 
       <img src="images/rim-middle.png" class="floating-rim-wrapper" id="rim-9"> 
      </a> 
      <a href="#"> 
       <img src="images/rim-middle.png" class="floating-rim-wrapper" id="rim-10"> 
      </a> 
      <a href="#"> 
       <img src="images/rim-middle.png" class="floating-rim-wrapper" id="rim-11"> 
      </a> 
      <a href="#"> 
       <img src="images/rim-middle.png" class="floating-rim-wrapper" id="rim-12"> 
      </a> 
       <div id="shadow-container"> 
        <img src="images/shadow.png" class="shadow"> 
        <img src="images/shadow.png" class="shadow"> 
        <img src="images/shadow.png" class="shadow"> 
        <img src="images/shadow.png" class="shadow"> 
        <img src="images/shadow.png" class="shadow"> 
        <img src="images/shadow.png" class="shadow"> 
       </div> 
      </div> 

任何帮助将大规模赞赏！

Answer 1

试试这个，

var i=900; 
$("#floating-rim-container").find(".floating-rim-wrapper").each(function(){ 
    hover($(this),i); 
    i=i+100; 
}); 

类似的shadow