2

私は次々とフェードインすることができたブロッククォートをたくさん持っています。現時点では、最後のものがフェードインおよびフェードアウトした後、関数は終了します。しかし、ループして最初からやり直したいです。これまでのところ動作する私のコードは次のとおりです。

$("div.quotes blockquote").each(function (index){
  $(this).delay(4500*index).fadeIn(500).delay(4000).fadeOut(500);
});

ループさせるにはどうすればよいですか？

4

4 に答える 4

2

考えられる解決策の 1 つ:

function run() {
    var els = $("div.quotes blockquote");
    els.each(function(i) {
        $(this).delay(4500 * i).fadeIn(500).delay(4000).fadeOut(500, function() {
            if (i == els.length - 1) run();
        });
    });
}
run();

デモ: http://jsfiddle.net/eDu6W/

于 2012-11-22T13:04:37.753 に答える
0 
function toggleBlockQuotes()
{
    var countBlockquotes = $("div.quotes blockquote").length;
    var b = 1;
    $("div.quotes blockquote").each(function (index)
    {
        $(this).delay(4500*index).fadeIn(500).delay(4000).fadeOut(500);
        b++;
        if(b == countBlockquotes)
        {
            toggleBlockQuotes();
        }
    });
}

これは無限ループを作成することに注意してください。

于 2012-11-22T13:04:16.867 に答える
0 
function loop() {
    $("div.quotes blockquote").each(function(index) {
        $(this).delay(4500 * index).fadeIn(500).delay(4000).fadeOut(500, function() {
            loop();
        });
    });
}

loop();​
于 2012-11-22T13:05:19.830 に答える
0

このように行うことができますが、正確に必要なものに依存します: http://jsfiddle.net/MmPgG/

(function loopAnim() {
    var $elems = $("div")
    $elems.each(function(index) {
        var $that = $(this);
        (function() {
            $that.delay(4500 * index).fadeIn(500).delay(4000).fadeOut(500, function() {
                if (index == $elems.length - 1) {
                    $elems.show();
                    loopAnim()
                }
            });

        })($that)
    });
})()​
于 2012-11-22T13:12:17.160 に答える