jQuery：为什么我不能让这个动画重复？

html:

这是动画：

.one, .two, .tri, .four, .five {position: absolute;}  
.two {bottom: 0;}
.tri {left: -348px;}
.four {left: 348px; top: 19.8em;}
.five {right: -257px;}

我曾尝试将其放入回调函数中，但无法使其工作，因此我使用了延迟。我知道这是一个不同的问题，但如果有人知道为什么回调不起作用，请告诉我

无论如何，我正试图让这个动画无限期地重复。我尝试过setInterval，我尝试过将它放入一个函数中，然后从内部再次调用它，通常我可以在网上找到任何可能的解决方案，但似乎都不起作用。 如果您能给我任何帮助，我将不胜感激。

试试这个

var one = $('.one');
var two = $('.two');
var tri = $('.tri');
var four = $('.four');
var five = $('.five');

$(two, tri, four, five).hide();

//first image
$(one).animate({
        'top' : '-17.5em'
    }, 8000, function() {
        $(two).show();
        $(one).delay(6000).fadeOut(1500);
    });

    //second image
    $(two).delay(13700).animate({
        'bottom' : '-30.7em'
    }, 11000, function() {
        $(tri, four, five).show();
        $(two).delay(6000).fadeOut(1000);
    });

    //third/fourth/fifth image
    $(tri).delay(31500).animate({
        'left' : '0'
    }, 600, function() {
        $(tri).delay(6000).fadeOut(1000);
    });

    $(four).delay(31500).animate({
        'top' : '0'
    }, 600, function() {
        $(four).delay(6000).fadeOut(1000);
    });

    $(five).delay(31500).animate({
        'right' : '0'
    }, 600, function() {
        $(one).delay(5000).css({'top' : '0'}).fadeIn();
        $(five).delay(6000).fadeOut(1000);
    });

---

要无限期地重复某件事，setInterval应该可以正常工作。我知道这是一个麻烦，但是你能给出一个用上述代码使用setInterval的例子吗？我试过了，但它要么根本不起作用，要么只运行一次但不重复。你可以将动画包装在回调fct中，然后在while循环中调用此fct。也许这有帮助：非常感谢你，费米奇。我试过了，它也做过同样的事情：它运行一次，然后什么都没有。我不明白。试试看控制台。它将在1.5秒后继续添加1,2,3

var one = $('.one');
var two = $('.two');
var tri = $('.tri');
var four = $('.four');
var five = $('.five');

$(two, tri, four, five).hide();

//first image
$(one).animate({
        'top' : '-17.5em'
    }, 8000, function() {
        $(two).show();
        $(one).delay(6000).fadeOut(1500);
    });

    //second image
    $(two).delay(13700).animate({
        'bottom' : '-30.7em'
    }, 11000, function() {
        $(tri, four, five).show();
        $(two).delay(6000).fadeOut(1000);
    });

    //third/fourth/fifth image
    $(tri).delay(31500).animate({
        'left' : '0'
    }, 600, function() {
        $(tri).delay(6000).fadeOut(1000);
    });

    $(four).delay(31500).animate({
        'top' : '0'
    }, 600, function() {
        $(four).delay(6000).fadeOut(1000);
    });

    $(five).delay(31500).animate({
        'right' : '0'
    }, 600, function() {
        $(one).delay(5000).css({'top' : '0'}).fadeIn();
        $(five).delay(6000).fadeOut(1000);
    });

var ctr = 0;
function animate_me(){
++ctr;
//your code;
console.log('animating... #'+ ctr);

//setTimeout(animate_me, 6000);
setTimeout(animate_me, 1500);
}

$(function() {
    animate_me();
});