点击javascript平滑滚动

Question

我正在使用这个链接:

<a class="" onclick="location.href='#top'" href="superContent">superContent</a>

它同时做了两件事:

1. 将用户跳转到页面顶部
2. 执行其他(不相关的)ajax 加载功能

一切都很好，除了我想弄清楚如何让它更顺畅地滚动到顶部。我尝试添加 .scroll 以将其附加到我的 jquery scrollTo 插件，但没有任何反应，这可能与我使用的是 javascript onclick 的事实有关，而 href 属性完全做其他事情。

有没有办法将动画平滑滚动附加到 onclick="location.href='#top'"？

Answer 1

试试这个，它为 scrollTop() 函数设置动画。

设置链接的id:

<a id="link">link</a>

jquery 滚动:

$('#link').click(function(e){
  var $target = $('html,body');
  $target.animate({scrollTop: $target.height()}, 500);
});