Javascript jQuery动画函数定时

感觉我忽略了这里显而易见的东西

我有好几个VAR是这样设置的：

var productOne = function () {
          $(".product2").fadeIn(200).animate({"right": "+=75px"}, 500, "easeOutElastic").delay(3000).fadeOut(200).css("right", "0");
          $(".product-text.two").fadeIn(200).delay(3500).fadeOut(200);
        }

var productTwo = function () {
          $(".product2").fadeIn(200).animate({"right": "+=75px"}, 500, "easeOutElastic").delay(3000).fadeOut(200).css("right", "0");
          $(".product-text.two").fadeIn(200).delay(3500).fadeOut(200);
        }

等等…然后我想按顺序发射它们，就像这样，然后循环回到第一个：

       window.setInterval(function() {
          $(productTwo);
          $(productThree);
          //and so on
      }, 5000);

---

但他们都同时开火。如何在每次函数调用之间放置特定数量的ms？

您需要在上一次调用的末尾触发每个ms。因此productOne将设置Timeout以调用Product2，productRwo将设置Timeout以调用Product3，productThree以调用productOne

ETA示例：

var productOne = function () {
      $(".product2").fadeIn(200).animate({"right": "+=75px"}, 500, "easeOutElastic").delay(3000).fadeOut(200).css("right", "0");
      $(".product-text.two").fadeIn(200).delay(3500).fadeOut(200);
      setTimeout(productTwo, 5000);
    }

var productTwo = function () {
      $(".product2").fadeIn(200).animate({"right": "+=75px"}, 500, "easeOutElastic").delay(3000).fadeOut(200).css("right", "0");
      $(".product-text.two").fadeIn(200).delay(3500).fadeOut(200);
      setTimeout(productThree, 5000);
    }

 $(".product2").fadeIn(200).animate(
    {"right": "+=75px"}, 
    500, 
    "easeOutElastic",
     function() {
    // call your next animation here.  Add delays here if you want...
  }).delay(3000).fadeOut(200).css("right", "0");

---

如果希望动画按顺序启动，则应从完整回调函数调用下一个动画。例如：

 $(".product2").fadeIn(200).animate(
    {"right": "+=75px"}, 
    500, 
    "easeOutElastic",
     function() {
    // call your next animation here.  Add delays here if you want...
  }).delay(3000).fadeOut(200).css("right", "0");

---

你说的

循环回到第一个
是什么意思？@Abe Miessler:他想运行productOne、productTwo、producttwree、productOne、productTwo等等。为什么要投否决票？有人认为我的解决方案有问题吗？如果是这样的话，请让我知道你的答案是什么，因为我相信这更符合动画应该如何工作的精神，而且你不必为动画中的每个序列定义命名函数。这似乎是在一行上编辑计时的最佳方式-有一段时间没有编写开关，甚至没有编写原生JS，非常好，thx很多。据我所知，这是setInterval方法的最佳替代方法，它不太可靠。如果要一个接一个地执行不同的jQuery动画，那么应该使用链接它们，或者使用回调函数等待前一个动画完成，然后再启动新的动画。干杯我刚刚开始尝试，但我的语法到处都是。如果我想让产品淡出，下一个淡入，setTimeout调用在哪里输入？如果它们是连续的动画，那么它们需要在动画的回调中。如果计时足以覆盖动画时间，则它只是函数的结束部分。