jquery - 在一个 div 内滚动会自动触发滚动到其他 div 中的相关段落？

Question

我正在开发一个项目，该项目涉及三个可滚动的 div，其中包含一些文本段落。文本中的某些段落可以松散地相互关联。我想要发生的是，如果读者滚动到第一个 div 中的特定段落，其他两个 div 会自动滚动到它们包含的文本中的相关段落。这样，三个段落将同时显示，而读者可以通过向下滚动来自行决定他想进一步探索哪个 div/文本。这可以通过使用 JQuery 插件来实现吗？我该如何实现它？

非常感谢您！

编辑：我有一些 HTML/CSS 的基本知识，但我是 jQuery 新手。

Answer 1

使用 jQuery（没有插件）这是很可能的，要做到这一点，您可能需要处理每个 div 的 onscroll 事件。

这是一个简单的JSFiddle，演示了以下代码：

$(document).ready(function() {
    $('.ScrollingDiv').scroll(function() {
        var CurScrollHeight = $(this).scrollTop();
        //alert('in scroll');
        $('.ScrollingDiv').each(function() {
            //alert('in each');
            $(this).scrollTop(CurScrollHeight);
        });
    });
});

此代码将处理程序应用于页面上每个具有类的元素的 onscroll 函数ScrollingDiv，当其中一个元素滚动时，它将找到所有其他元素并将滚动高度设置为相同。

对于您的情况，您需要做的是想出一种方法来确定查看每个 div 中的段落所需的滚动高度，即第一个 div 可能是 200px 高度，第二个可能是 400px 高度，第三个可能是 150px 高度等。 ..

一旦你有了这个，只需更改我提供的代码以适应你的功能。您可能需要设置 div 的 ID 并找到各个元素并获得所需段落的正确高度。