1

.col-n一連の要素 ( ) を間隔でアニメーション化したいと考えています。.col4 つの要素 (.col-1など) があり、それぞれのクラスをアニメーション化したいとしましょう。

でいくつかやってみましたforがsetInterval、うまくいきません (ループしているだけです):

    container.children('.col').last().on('click', function() {
        for(var i = 1; i <= columns; i++) {
            var int = self.setInterval(function() {
                console.log('a')
            },500*i)
        }
    });

これでjQueryから試しeachましたが、これでもありません。誰かが私を正しい方向に向けることができますか?

フィドル: http://jsfiddle.net/s5DMe/

関数を次々に実行したくないことに注意してください。ただし、1 つ実行し、(最初の関数が終了したかどうかに関係なく) 待ってから、別の関数を実行します。

4

2 に答える 2

0 
.col-1 { background: #ccffff; transition-delay: 200ms }

.col-2 { background: #b3ffff; transition-delay: 400ms }

.col-3 { background: #99ffff; transition-delay: 600ms }

.col-4 { background: #80ffff; transition-delay: 800ms }

アニメーション クラスをすべての に同時に追加できます.col-*。はtransition-delay、フェイク シーケンスを処理します。

もちろん、プロパティのブラウザ プレフィックス バージョンも追加する必要があります。

于 2013-09-08T18:03:13.993 に答える