如何使容器滚动到元素

Question

我有一个包含大量文本的容器，我想自动滚动到该容器中的各种元素。 我可以使用jQuery为容器设置动画，以便很好地滚动一定距离，但是我确定距离是多少。

我看到的大多数提示建议使用.offset（）。top属性来获取该距离，但在这种情况下这不起作用。 看看这个jsfiddle的例子。

注意 ：小提琴的目标段落标签是容器的直接子节点，但我不想依赖它。 我希望能够为任何元素获得适当的滚动距离，无论它们有多深的嵌套。

Answer 1

试试这个：

var pOffset = $("#lipsum").scrollTop();
pOffset = pOffset + $("#lipsum p.active").position().top; 

.scrollTop()给出DIV的当前滚动位置，将P元素的位置添加到它，滚动就可以了。

Answer 2

.offset()获取元素相对于整个页面的位置。

你需要的是.position() ，它将获得元素相对于其包含元素顶部的位置。

编辑：这里它与更新的JSFiddle一起使用

编辑2：我刚刚注意到它没有添加滚动位置就无法工作。 您需要从包含div中添加.scrollTop() 。 这是一个更新的JSFiddle 。 （这次工作）