Question

我正在尝试创建一个简单的图片幻灯片，但它并不完全按照我想要的方式工作。当它循环遍历所有图像时，我希望它立即循环回到第一张图片。但是，在它循环回来之前似乎有一个延迟，这不是我想要的。我该如何解决这个问题？

这是我的codepen https://codepen.io/tayanderson/pen/vWQXbd

$(document).ready(function(){
  var seconds = 2000;
  var step = 0;
  var limit = 2;

  $("#Background").addClass("image-"+step).fadeIn(500);

  setInterval(function(){
    $("#Background").fadeOut(500,function(){
       $(this).removeClass("image-"+step);
       step = (step > limit) ? 0 : step + 1;
      $("#Background").addClass("image-"+step).fadeIn(500);
    });
  },seconds);
});

Answer 1

将限制更改为零：limit = 0;

即使您的codepen示例中有2张图片，您也可以在0开始步骤（计数），并且只在step > limit时重置幻灯片，这需要4“轮”。

我在这里举了一个例子（见计数器）：https://codepen.io/anon/pen/YERNrP

循环播放前jquery幻灯片延迟？

1 个答案: