将固定的div滚动到另一个div的顶部？

Question

我在JSFiddle中有一些代码。

让我向你解释清楚：

我希望#top_bar始终滚动并完全保持在div的顶部，ID是用户点击它时超链接的href值（另一方面，#top_bar的下边框如果目的地div），它靠近顶部边界。

假设您点击了DIV4链接，#top_bar将固定在屏幕顶部，窗口将滚动到#DIV4，但#top_bar会也涵盖了#DIV4的一些内容。

我该如何解决？

Answer 1

首先，你的jsfiddle没有运行，因为你已经将代码包装在文档头中。我纠正了它。您可以查看http://jsfiddle.net/maYHb/44/

更新的js

现在回到您的查询。你有动画滚动html和body标签。并且您希望div显示数字（即设置菜单栏下面的精确顶部而不是它后面）。 您没有考虑菜单高度和给出这些元素的边距。你也考虑到了这一点。请检查上面的小提琴。我添加了这段代码。

   var dest_pos = $(anchor).offset().top-38-40; // 38px for menu div height and 40 px for margin. 
   $('html, body').animate({scrollTop: dest_pos}, 1000);

请调整具有共同边距和结构的css，您将获得所需的输出。直到那时我也会尝试改进css。

而不是给动画滚动到身体。把它交给div包装器。