设置间隔“堆叠”

setInterval 'stacking' up

本文关键字：堆叠 设置      更新时间：2023-09-26

使用 setInterval 运行一个函数，该函数为列表提供"闪光"效果。

如果我保持页面打开，但访问另一个选项卡/在 10 分钟左右返回，setInterval 感觉就像它每 1 秒工作一次，因为函数不断被调用。

对我来说感觉它随着时间的推移而堆积起来，无论如何要解决这个问题？

function flashListItems(){
  $('.imageview_navigation li').each(function(i) {
    $(this).delay((i++) * 100).fadeTo(200, 0.8).fadeTo(200, 1);
  });
}
setInterval(function(){
  flashListItems();
}, 10000);

小提琴：http://jsfiddle.net/6w6wrsm0/

您的代码没有错，一些 Web 浏览器会减慢这些类型的间隔，以免造成过多的使用。因此，当不使用网页时，一个间隔的最快时间通常约为 1 秒。

可能有一种方法可以解决此问题，此处提到：

如何让 setInterval 在 Chrome 中的标签页处于非活动状态时也能正常工作？

只需按实际运行时间使您的动画功能滴答作响即可。

var div = $('#my-div');
var leftValue = 0;
var interval = (1000/20); //20fps
var before = new Date();
setInterval(function()
{
    now = new Date();
    var elapsedTime = (now.getTime() - before.getTime());
    if(elapsedTime > interval)
    {
        //Recover the motion lost while inactive.
        leftValue += Math.floor(elapsedTime/interval);
    }
    else
    {
        leftValue++;
    }
    div.css("left", leftValue);
    before = new Date();    
}, interval);
相关文章：