Question

可能重复：
ScrollTop really jerky in Chrome

我正在使用以下代码获取一个返回顶部按钮，并在用户滚动后导航淡入。问题是每次滚动时它都会触发，因此导致滚动变得非常生涩。是否有另一种方法可以执行此操作，这可能只会触发一次该功能？

    $(function () {
    $(window).scroll(function () {
        if ($(this).scrollTop() > 600) {
            $('#backToTop, #navigation').fadeIn();
        } else {
            $('#backToTop, #navigation').fadeOut();
        }
    });
    }); 

   });

Answer 1

也许设置超时......

function scrollit(){  
    if ($(this).scrollTop() > 600) {
    $('#backToTop').fadeIn();
    } else {
    $('#backToTop').fadeOut();
    }
     }

var timer;

$(window).scroll(function () {

window.clearTimeout(timer);
timer = window.setTimeout(function(){ scrollit(); }, 2000);

    });

Answer 2

您可以实施Ben Alman's jQuery throttle or debounce插件。基本上这限制了您的功能只能运行一定次数。两者之间的区别在网站上有解释：

嗯，简单地说：虽然限制限制执行a 每个延迟毫秒的功能不超过一次，去抖动保证该功能只能一次执行（给定一个指定的阈值）。

替代（窗口）.scroll

2 个答案: