javascript - 如何在 JavaScript/jQuery 中同步两个不同 div 的滚动条？

Question

我的index.html页面中有两个div，我通过选择div并将内容注入(inject)其中(使用jQuery)在每个div中加载不同的内容。所以我获得了两个div，每个div都有一个水平滚动条来显示其内容。我想做的是同步两个滚动条，以及是否可以为两个 div 只设置一个滚动条。

提前感谢您的回答，如果我在英语方面犯了错误，我们深表歉意，因为这不是我的母语。

Answer 1

您可以使用 jQuery 的scrollLeft() 函数获取当前滚动位置，如下所述: http://api.jquery.com/scrollleft/

您只需设置两个相互激发的滚动监听器(请务必将其放入文档的就绪函数中!):

var div1 = $('#scrollDiv-1');
var div2 = $('#scrollDiv-2');

div1.scroll(function() {
    div2.scrollLeft($(this).scrollLeft());
});

div2.scroll(function() {
    div1.scrollLeft($(this).scrollLeft());
});

您可以使用 setTimeout 或 setInterval 来设置时间延迟以节省资源。