你可以使用jQuery动画滚动页面与特定的持续时间:

$("html, body").animate({scrollTop: "1024px"}, 5000);

其中1024px是滚动偏移量，5000是以毫秒为单位的动画持续时间。

$(".scroll-top").on("click", function(e){
   e.preventDefault();
   $("html, body").animate({scrollTop:"0"},600);
});

在其他例子中，动画总是从页面刷新后的页面顶部开始。

我通过不直接动画css来修复这个问题，而是调用window.scrollTo();每一步:

$({myScrollTop:window.pageYOffset}).animate({myScrollTop:300}, {
  duration: 600,
  easing: 'swing',
  step: function(val) {
    window.scrollTo(0, val);
  }
});

这也解决了html vs body的问题，因为它使用跨浏览器的JavaScript。

关于jQuery的animate函数的更多信息，请访问http://james.padolsey.com/javascript/fun-with-jquerys-animate/。

你可以使用.animate() scrollTop属性，就像这样:

$("html, body").animate({ scrollTop: "300px" });

你可以使用jQuery动画滚动页面与特定的持续时间:

$("html, body").animate({scrollTop: "1024px"}, 5000);

其中1024px是滚动偏移量，5000是以毫秒为单位的动画持续时间。

尼克的回答很管用。在animate()调用中指定complete()函数时要小心，因为它将被执行两次，因为你声明了两个选择器(html和body)。

$("html, body").animate(
    { scrollTop: "300px" },
    {
        complete : function(){
            alert('this alert will popup twice');
        }
    }
);

下面是避免双重回调的方法。

var completeCalled = false;
$("html, body").animate(
    { scrollTop: "300px" },
    {
        complete : function(){
            if(!completeCalled){
                completeCalled = true;
                alert('this alert will popup once');
            }
        }
    }
);