如何让jquery动画流畅地工作？

我的html页面中有这段代码

  $('#buttonMenu').on('click',function(){
    var errDiv = $("#divWhichToMoveTo");
    errDiv.show();
    var pos = errDiv.position().top;
    $("html, body").animate({ scrollTop: pos });
  });


  <li><a id="buttonMenu" title="Yea" alt="Yea" href="#">Yea</a></li>

  <div id="divWhichToMoveTo"><strong>An error occured, oh noes!!</strong></div>

$（“#按钮菜单”）。在（'click'，function（）上{
var errDiv=$（“#divwhichtomovivot”）；
errDiv.show（）；
var pos=errDiv.position（）.top；
$（“html，body”）.animate（{scrollTop:pos}）；
});

发生错误，哦，没有

---

当用户点击“buttonMenu”时，应该使页面向下（轻轻）滚动到“divwhichtominove”的位置。它可以工作，但我在一个长页面中有几个按钮和几个div。有时，在html页面的不同点上从一个页面传递到另一个页面，我可以在动画开始之前看到html页面的开始，并将我从我所在的位置带到我想要着陆的位置。我遗漏了什么？

您可以这样以毫秒为单位添加时间-->

如果我没记错的话，1000毫秒是1秒

改用这个：

$('#buttonMenu').on('click', function (e) {
    e.preventDefault();
    var errDiv = $("#divWhichToMoveTo");
    errDiv.show(function () {
        $("html, body").animate({
            scrollTop: errDiv.offset().top
        }, 1000);
    });
});

e.preventDefault（）

阻止进入

#

的默认操作。这就是页面跳转的原因

.position（）.top

返回了错误的值。这使用了

.offset（）

，它可以获得相对于文档的偏移量，并且工作正常

演示：（刚刚应用了边距，所以有地方可以滚动）

添加javascript:void（0）代替锚链接中的#也会有所帮助

比如说

写

<a href="javascript:void(0)">Yea</a>

代替

<a href="#">Yea</a> 

我想我可以帮助澄清其他回答者似乎遗漏的问题。这是一把小提琴。向下滚动到“Yea”链接，并在单击时注意右滚动条。滚动条跳到顶部，然后设置动画到末端。Elisabetta在问为什么页面在滚动之前会跳到顶部。效果非常好！谢谢你的充分解释！

<a href="#">Yea</a>