javascript - 在带有 overflow-y :scroll 的固定元素内使用 scrollTop

Question

当我的内容位于指定了 overflow-y: scroll 的固定位置容器内时，我似乎无法让 scrolltop 工作。

这是我的相关代码:

/* some container with many large content blocks inside */
#container {
    position: fixed;
    width: 300px;
    height: 300px;
    overflow-y: scroll;
}

/* button that has a data-path attribute that specifies where the container should scroll to*/
$(".button").on("click", function(){
    var path = $(this).attr("data-path");
    var anchor = $("#" + path);
    var position = anchor.position().top;
    $("#container").animate({scrollTop: position});
});

我相信这个 fiddle 很好地说明了我的困境:http://jsfiddle.net/Qndu5/

如果您从上向下滚动到某个元素，效果会很好。在那之后，所有的赌注都被取消了。它完全无法从顶部以外的任何位置滚动。它要么可怕地错过了标记，要么一直滚动回到顶部，即使提供给它的位置值看起来是正确的。

当然我在这里遗漏了一些东西，但我不确定我不理解的是什么。感谢您提供的任何帮助!

Answer 1

计算位置时缺少的是 scrollTop，因此如果 View 已经滚动，则需要将其添加到计算中 var position = anchor.position().top + $("#container ").scrollTop();

http://jsfiddle.net/x36Rm/