在两个元素之间同步滚动条 - jQuery

Question

如何在两个元素 之间同步滚动条而不用 递归调用每个事件？

通常您会期望以下代码：

$div1.scroll(function() {
    $div2.scrollTop($div1.scrollTop());
});
$div2.scroll(function(){
    $div1.scrollTop($div2.scrollTop());
});

但是在这种情况下，如果你滚动$ div1 1px，它也会滚动$ div2 1px，这将提示$ div2滚动事件触发并重新将滚动位置应用到$ div1。 虽然这可能看起来不是问题，但当此代码应用于页面并且您自然地使用鼠标滚动时，它会以1px的增量滚动，因为处理程序会相互调用并且不允许滚动流动。

那么，你会如何解决这个问题呢？

示例：https://jsfiddle.net/axtn/a91fsar3/2

Answer 1

找到了一个很好的解决方案。辩解可以解决问题。

您可以使用计时器和bool的组合来确保用户正在滚动元素。因此，当滚动事件被快速并连续地触发时（例如当用户向下滚动时），它阻止处理程序递归地相互调用。以下代码可以解决这个问题：

for

查看功能正常的jsbin：https://jsfiddle.net/axtn/a91fsar3