Javascript jquery多功能计时和重复

我用jquery创作了一部电影；它由代表电影中每个场景的多个函数组成。有些场景必须比其他场景长。我无法创建整个电影的循环。我尝试了几种设置setInterval的方法，但都失败了。使事情复杂化的是（至少对我来说），这是一个幻灯片放映的内部，理想情况下，幻灯片放映完成后会触发“下一步”按钮

请随意敲打我在每个场景中用作setTimeout的策略，这是我唯一能够弄清楚如何在下一个函数运行足够长的时间后让每个函数运行的方法。我不知道如何使用场景应该运行的时间来调用每个函数，而我当前的策略是在前一个函数完成后调用下一个函数

谢谢你的指导

我想我需要javascript来计算总时间，并在setTimeout中使用该值调用atrAnime（），但我似乎无法让它计算并返回

以下是我所拥有的：

$(document).ready(function(){

    atrAnime(2000);

});
function atrAnime(dur){
    first();
    setTimeout(second, dur);
    setTimeout(third, dur += 2000);
    setTimeout(forth, dur += 2000);
    setTimeout(fifth, dur += 2000);
    setTimeout(sixth, dur += 6000);
    setTimeout(seventh, dur += 2000);
    setTimeout(eighth, dur += 2000);
    setTimeout(ninth, dur += 2000);
    setTimeout(tenth, dur += 2000);
    setTimeout(end, dur += 3000);

};

一些场景示例：

function first(dur){

    $('.pcba')
        .css({
            left: '150px'
            })
        .show();
    $('.pcb_cad')
        .css({
            left: '275px',
            top: '50px'
            })
        .show();
}
function second(dur){
        $('.pcba').fadeOut();
        $('.arrows')
        .css({
            left: '275px',
            top: '50px'
            })
        .fadeIn();
        $('.heatGenComps')
            .css({
                left: '325px',
                top: '20px'
                })
        .fadeIn();

}

编辑 我的新犹太区解决方案在atrAnime（）调用中的最后一个函数为：

然后是另一个函数

function caller(){
    atrAnime(2000);
}

---

您正在动画中使用一些函数，这些函数实际上在其操作完成后提供回调方法。例如，

fadeIn

/

fadeOut

函数有一个“onComplete”回调，用于在元素完全显示/隐藏时-

$("#elem").fadeOut(function(){
  alert('element has faded out!');
});

您可以利用这些回调函数，让它们都调用一个管理执行序列的中心函数。每个回调将触发下一个序列。

show（）

和

fadeIn（）

函数都提供了此回调，如文档中所述

---

将所有动画嵌套在回调中不是更好吗？依赖setTimeout:）感觉不对。我的意思是使用相关动画的回调，这样下一阶段的动画只会在前一阶段完成后启动。大致如下：

$("firstElement").slideDown(500, function () { 
    $("secondElement").slideDown(500, function () { 
        $("thirdElement").slideDown(500, function () { 
            //etc
        });         
    });  
});

---

好的一点…如果他们都有回调（他们应该），除了重新构造代码（我也不反对），我不确定如何定义每个场景运行的时间量。。。除非回调是设置超时的，这就是我所拥有的？我很感激你的回答，但更重要的是循环。。。我正在用我正在使用的新的犹太人区解决方案编辑我的原稿。setTimeout在你们真正的开发人员中是不可靠的/被回避的吗？我定义场景之间的时间量的能力非常重要…你的例子很有意义，但每个场景都有多个功能同时或之后启动（取决于场景）因此，我必须弄清楚如何在函数中包装场景，为整个函数添加延迟（以控制场景之间的时间）然后回调到下一个场景。setTimeout肯定有它的位置，但我不相信它用于动画等，因为它不知道上一个任务是否已完成。它完全基于时间。另一个选项是为每个单独的场景创建一个函数，然后构建实际的“电影”“使用我上面提到的结构。这样，您可以根据需要多次调用同一场景，并可能将持续时间参数传递给该函数，以便动画回调将触发下一个场景，持续所需的秒数。

$("firstElement").slideDown(500, function () { 
    $("secondElement").slideDown(500, function () { 
        $("thirdElement").slideDown(500, function () { 
            //etc
        });         
    });  
});