0

我制作了一个轮播并使用 javascriptsetInterval()函数在轮播中以固定间隔旋转图像。这是我用过的脚本

var timeOut = 4000;

function showSlide() {
       //....script for showing image
}

function pauseSlide() {

   setInterval(function(){showSlide();}, timeOut);

}

jQuery(document).ready(function() {
        pauseSlide();
});

现在的问题是，当我更改浏览器选项卡并在几分钟后再次回到轮播浏览器时，我看到轮播运行速度太快而不是默认时间间隔，假设时间间隔为 0，图像会快速变化。请帮助我如何解决这个问题。

4

3 回答 3

4

你必须在开始另一个间隔之前摆脱第一个间隔，或者你开始同时工作多个间隔（即为什么你开始看到它“更快”）

做这个

var timeOut = 4000;
var interval = 0;

function showSlide() {
       //....script for showing image
}

function pauseSlide() {

   clearInterval(interval);
   interval =  setInterval(function(){showSlide();}, timeOut);

}

jQuery(document).ready(function() {
    //NOW you can do multiple pauseSlide() calls
     pauseSlide();
     pauseSlide();
     pauseSlide();
     pauseSlide();
     pauseSlide();
});
于 2012-09-04T15:06:18.050 回答
1

据我所知，在 Firefox 和 chrome 的较新版本中，后台选项卡已将 setTimeout 和 setInterval 限制为 1000 毫秒以提高性能。所以我认为你的问题可能与此有关。

也许这会有所帮助：当标签在 Chrome 中处于非活动状态时，如何使 setInterval 也起作用？

于 2012-09-04T15:07:03.710 回答
0

图像变化快于预期可能表明您以一种或另一种方式多次调用 pauseSlide()。

是document ready你调用函数的唯一地方吗？showlide 中的任何代码或触发文档就绪事件的任何地方？如果你alert()输入pauseSlide()，它会弹出不止一次吗？

于 2012-09-04T15:08:28.107 回答