javascript - 重构 jQuery 以淡出并阻止浏览器崩溃

Question

这个js可以工作，但是一段时间后它会使任何打开的浏览器崩溃。我必须关闭一些循环吗？

我还想将幻灯片效果更改为淡入/淡出(仅替换 .slideDown 并不能做到这一点)。想法？

function ticker() {
    $('#jsTicker li:first').slideUp(function() {
        $(this).appendTo($('#jsTicker')).slideDown(1500);
    });
}
setInterval(ticker, 6000);

http://jsfiddle.net/KevinOrin/Zh3wU/

Answer 1

setInterval 基本上是一个无限循环。

您当前的函数不会等待 SlideUp 完成后再重新开始。

尝试使用 setTimeout 代替:

(function() {
    var tickerTimer;
    function ticker() {
        clearTimeout(tickerTimer);
        $('#jsTicker li:first').slideUp(function() {
            $(this).appendTo($('#jsTicker')).slideDown(1500, function(){
                tickerTimer = setTimeout(ticker, 6000);
            });
        });   
    }
    tickerTimer = setTimeout(ticker, 6000);
})();