jquery setinterval最小化队列

我正在使用jQuery为使用淡入淡出和追加的横幅设置动画。我遇到的问题是，虽然产生了期望的结果，但每当我最小化或更改标签页时，动画队列和网页在我再次打开时都会变得疯狂！jquery setinterval最小化队列

我该如何防止这种情况发生？我可以添加if语句来检查动画是否已经在运行？我可以将它脖子装成一个动画吗？

考虑：

$(function() { 
    var fElement = $('.fadein'); 
    fElement.find('img:gt(0)').hide(); 
    setInterval(function() { 
     if (!fElement.data('paused')) { 
      fElement.find(':first-child').fadeOut().next('img').fadeIn().end().appendTo('.fadein'); 
     } else { 
      console.log('waiting...'); 
     } 
    }, 5000); 

    $('map').hover(
     function() { 
      console.log('pausing'); 
      fElement.data('paused', 1); 
     }, 
     function() { 
      console.log('unpausing'); 
      fElement.data('paused', 0); 
     } 
    ); 
}); 

     if (!console && !console.log){ 
      console = {}; 
     console.log = function(){}; 
    }

和HTML：

<div class="fadein"> 
    <img src="#" usemap="#" border="0" width="964" height="49" alt="" style="" id="level2Menu"/> 
    <img src="#" usemap="#" border="0" width="964" height="49" alt="" style="" id="level2Menu"/> 
</div>

此外，小提琴：http://jsfiddle.net/L8ztR/

虽然它似乎是行为异常......

谢谢！

编辑：固定使用.stop（true，true）！

来源

2013-10-14 Myles

尝试通过

var continueLooping = true; 
(function theLoop(){ 
    if (!fElement.data('paused')) { 
      fElement.find(':first-child').fadeOut().next('img').fadeIn().end().appendTo('.fadein'); 
    } else { 
     console.log('waiting...'); 
    } 
    if(continueLooping){ 
    setTimeout(theLoop, 5000); 
    } 
})();

什么，做是完全一样的setInterval除了代码实际上启动等待下一次迭代超时之前要执行更换你的setInterval呼叫。在惊人的更多的解释： http://paulirish.com/2010/10-things-i-learned-from-the-jquery-source/

然后你可以，而不是设置数据暂停或不设置continueLooping为真或假，或拨打该代码多次（不这样做）

来源

2013-10-14 15:02:30

感谢你的帮助！我认为我现在有一个语法错误＆似乎无法发现它是什么，萤火虫也不是很有用... 我将编辑OP – Myles

jquery setinterval最小化队列

回答

相关问题