Javascript jQuery动画滚动顶

我在一个div中有很多

部分

标记，溢出设置为

隐藏

。代码大致如下所示：

<div id="viewport">
   <section>
      content
   </section>
   <section>
      content
   </section>
</div>

我使用它来调整

#viewport

div的大小，因为

部分的大小不同。当我尝试将此滚动部分放入该功能时：


$('#mn a').click(function(){
   var aHref = $(this).attr("href");
   var sectionHeight = $('section'+aHref+'').height();
   $('#viewport').height(sectionHeight);
});


$('body,html').animate({scrollTop: $(aHref).offset().top}, 800);

它使整个页面滚动。当我尝试将
$（'body，html'）
替换为
$（'section，#viewport'）
时，它会在div内滚动，但这样做并不正确

我有一个活生生的例子。我假设它与
.offset（）
或我传递给
.animate（）
的内容有关，但我尝试了很多不同的方法，但都没有效果。有人能给我指出正确的方向或告诉我我做错了什么吗？
首先，你应该防止锚的默认行为，以便将页面滚动到页面顶部。您可以通过调用
click
事件处理程序中的事件对象上的
preventDefault（）
方法来执行此操作。试试这个

$('#mn a').click(function(e){
   e.preventDefault();

   var aHref = $(this).attr("href");
   var top = $('section'+aHref+'').position().top;
   $('#viewport').animate({scrollTop: top}, 800);
});

问题在于
position（）
如何工作，它返回与
scrollTop
相关的top/height

因此，如果您请求单击
$（'section'+aHref+''）.position（）.top
返回的位置将从
scrollTop
值修改

您可以在准备活动时获得所有高度位置。（所以
scrollTop
是
0
）

或者，您可以使用以下方法清理位置值：

$("section#skills").position().top + $("#viewport").scrollTop()

如果你想要一个简单的jquery插件来实现这一点，那么你可以尝试（）它目前也支持30多种放松方式
我有
e.preventDefault（）
，但我认为它因为某种原因弄乱了一些东西，所以我把它拿了出来。不幸的是，你提出的解决方案也不起作用。你能提醒一下
sectionHeight
，看看你得到了什么吗？第一个是255。它使它前后滚动，但从来没有完全到底部。我把它放在这里：加载后，如果我点击任何链接，它都能正常工作。但在那之后，它就不再起作用了。