Question

在一些帮助下我使用jquery和CSS3创建了一个旋转滑块，除了一件事之外它似乎工作得很好......第一个'幻灯片'似乎在第一次播放时有两倍的延迟。谁能解释为什么会发生这种情况？任何帮助将不胜感激......

var i = 0;
var z = 0;
delay = 5000;

var el = $('#scroll-script');
var ql = $('#info-box');

var classesb = ['fp-info-one', 'fp-info-two', 'fp-info-three', 'fp-info-four'];    
var classes = ['fp-slide-one', 'fp-slide-two', 'fp-slide-three', 'fp-slide-four'];

var interval = setInterval(function () {

  el.removeClass().addClass(classes[i]);
  i = (i + 1) % 4;

  ql.removeClass().addClass(classesb[z]);
  z = (z + 1) % 4; 

}, delay);

Answer 1

您的匿名函数（setInterval中的函数）正在等待最初运行的相同时间（您的延迟）。你可以：

1）将匿名函数更改为命名函数，并在执行间隔

之前运行一次

2）在setInterval方法之前运行这些行。只是为了模拟匿名函数内的代码一次。

   el.addClass(classes[3]);
   ql.addClass(classesb[3]);

你可以查看这个小提琴，看看我提供的一些解决方案。

http://jsfiddle.net/G7NdU/4/

JavaScript / Jquery旋转滑块 - 双延迟问题

1 个答案: