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

refactor jQuery to fade and stop it from crashing browser

本文关键字:崩溃 浏览器 jQuery 淡出 重构      更新时间:2023-09-26

这个js可以工作,但过了一段时间,它会崩溃任何打开的浏览器。我必须关闭一些循环吗?

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

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

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

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);
})();

不要使用setInterval()。您没有考虑动画的异步行为。

使用setTimeout() ,尝试以下操作

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