偏移滚动是卡顿的

Question

我网站上的插件会动态地将onclick事件添加到列表中的所有项目。当用户单击列表项时，页面将滚动到所需的元素。我想在不编辑插件代码的情况下向滚动位置添加一些偏移量。

插件代码：

event.preventDefault();
var page = jQuery(elm).attr('href');
var speed = 750;
jQuery('html, body').animate( { scrollTop: jQuery(page).offset().top + 2 }, speed );
jQuery(page).focus();
return false;

我添加了自己的点击功能，可以自己滚动。它滚动到插件偏移量，然后重新调整到我的滚动位置。例如，它滚动到 0，然后向下滚动到 20。

可以调整代码以使滚动变为 20 吗？我已将速度调整为 0，但这会导致滚动闪烁。

$('.nav li').live('click', function () {
var targetCategory = $(this).find('a').attr('href');
$('html, body').animate({
scrollTop: $(targetCategory).offset().top - (offerHeight + headerHeight) + 'px'
}, 150);
}
});

Answer 1

这不是一个好的做法，因为您的代码正在相互争斗。您绝对应该找到一种方法来编辑插件或删除它。

如果这绝对不是一个选项，请尝试在添加您自己的代码(可以是插件的修改版本(之前删除元素的事件处理程序。

使用off()方法删除事件处理程序.doc

我不确定您的插件附加到哪个元素，但如果它是".nav li"，请运行$('.nav li').off()

此外，.live()已被弃用。请改用.on()。.doc

注意：由于您的"动画"同时运行，它会抖动，但在每一帧中，scrollTop 都设置为动画中的值，然后立即设置为第二个动画。