Question

我有一个根据网页位置定位div的功能。

function calcNav(){
    var b = $('#breadcrumb').offset().top;
    var w = $(window).scrollTop();
    var x = b - w;
    //console.log('breadcrumb from top = ' + b + ' window scrolled = ' + w + ' position of nav = ' + x);
    $('.sub-nav').css('top', x);
}
calcNav();
$(window).scroll(calcNav);

该功能效果很好，我唯一的问题是因为它不断渲染我的页面速度看起来有点滞后 - 有什么办法我可以在滚动结束而不是在期间运行该功能？

Answer 1

我建议您将它与setTimeout结合使用并添加少量毫秒：

var scrollTimeout;
$(window).scroll(function() {
    clearTimeout( scrollTimeout );
    scrollTimeout = setTimeout( calcNav, 50 );
});

在这种情况下，如果下一个滚动事件被触发的时间少于50毫秒，

clearTimeout用于不触发上一次调用，如果您认为用户滚动速度较慢，则可以将此值增加到例如100ms等。

窗口滚动功能滞后

1 个答案: