当用户向下滚动一定数量的像素时,我会修复标题。但是,有没有办法在用户满足逻辑后停止调用窗口滚动函数呢?我认为这对性能不利。查看我的控制台的屏幕截图 ( http://d.pr/i/OHDX )
$window.scroll(function() {
if ($window.scrollTop() > 100) {
$('.header').addClass('fixed');
console.log('fix header');
}
else {
$('.header').removeClass('fixed');
console.log('unfix header');
}
}
最佳答案
您必须不断检查滚动位置。我假设当用户向上滚动到 100 时您会想要取消修复它?
您当前的实现在性能方面表现良好。您可以添加的一件事是检查该类是否尚未添加,或者保留一个切换开关,以便您知道该类是否存在(而不是检查)。
$window.scroll((function() {
var fixed = false, elem;
return function () {
var should_fix = $window.scrollTop() > 100;
elem = elem || $('.header');
if (should_fix !== fixed) {
if (should_fix) {
elem.addClass('fixed');
console.log('fix header');
} else {
elem.removeClass('fixed');
console.log('unfix header');
}
fixed = should_fix;
}
};
}()) // immediate invocation, because it's awesome
关于javascript - 当用户滚动时,jQuery 窗口滚动停止触发,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/16065242/