Javascript 多个动画之间的CSS动画进程

我一直在使用Adobe Edge Animate创建一个基本上是站点介绍的内容。但我真的很想亲自编写代码。因此，我有一个问题

我如何根据一个数组连续播放多个动画

以下是我的想法： 1.数组保存每个图像的名称。 2.我想在屏幕上为每个图像制作动画，一次一个。 3.每幅图像在完成之前都将设置一次动画

我知道如何使用animationEnd事件。我的想法是，基本上，我会将一个子对象附加到容器div中，给它分配一个带有动画的类，使用animationEnd来知道它何时完成，那时我想转到下一个图像

但是，当我需要等待animationEnd启动时，如何循环遍历每个图像呢？有什么想法吗？有谁知道有一个好的教程涉及到这个问题吗

---

我将感谢任何指导！我不是要求你给我写太多代码，只是解释一下在等待animationEnd时我可以做循环的方式。我想这就是我被困在脑子里的地方。

你应该使用所谓的“循环函数”，一个可以多次调用自身的函数。它的功能通常很像循环，但对于异步的事情（如

animationEnd

event），它通常是最简单的方法

在您的案例中使用的示例如下：

var imgs=[/*images here*/];
function nextAnimation(curInd){
    var thisImg=imgs[curInd];
    //create the image element, trigger the animation, etc here
    //put the img element itself into a variable named imgElt, then:
    imgElt.addEventListener('animationEnd',function(){
        //only call the function again if this isn't the last item in the array
        if(curInd+1!=imgs.length)
            nextAnimation(curInd+1);
    },false);
}
nextAnimation(0);

---

把它通读几遍，过一会儿你就会明白了。还可以在线查看其他一些重复函数的示例，如果您以前没有做过太多编程，那么有时这是一个很难掌握的概念

太棒了！我不熟悉循环函数。我明白你的例子在做什么，这是有道理的。我会仔细阅读循环函数，以确保我能从整体上理解它们。我想，当我想结束循环时，我会设置一个标志或查看array.length，以了解我何时完成并需要跳转到另一个函数或执行其他操作？非常感谢你给了我如此准确和有用的答案，所有这些都没有责备我。哈哈，我很感激！最后一个问题：为什么我需要那个“false”呢？从技术上讲，你们不需要它，但你们应该把它放在那个里，我认为旧浏览器需要它。如果您真的想知道它的确切功能，请查看

addEventListener