0

私は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);
}

「#rim」と「#shadow」の数値が増加するだけでなく、速度も 100 ずつ増加するように for ループを設定したいと考えています。

私が構築しようとしたものは次のようになります。

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>

どんな助けでも大歓迎です！

4

1 に答える 1

0

これを試して、

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

に類似shadow

于 2012-08-29T16:39:20.690 に答える