如何同步两个div的滚动位置？

小编典典

javascript

我想将2个div的大小设置为特定宽度（即500px）。一个高于另一个水平对齐。

顶部框应隐藏其滚动条，底部框应显示滚动条，并且当用户滚动时，我希望顶部框的偏移量更改为底部框的值。因此，当底部DIV水平滚动时，似乎顶部DIV也同时滚动。

我很高兴在Jquery中做到这一点，如果它使过程更容易。

阅读 483

2020-05-01

共1个答案

小编典典

$(‘#bottom’).on(‘scroll’, function () {
$(‘#top’).scrollTop($(this).scrollTop());
});

在这里，我们用尽.scrollTop()了所有的价值，scrollTop使用滚动条从元素中获取值，并scrollTop为另一个元素设置来同步其滚动位置

假设您的底部元素的ID为bottom，顶部元素的ID为top。

您可以top使用CSS 隐藏元素的滚动条：

#top {
    overflow : hidden;
}

我想我从未真正有理由这样做，但是在实际操作中看起来很酷。

2020-05-01