jquery 动画滚动顶部回调

Question

我有以下 jquery 将页面滚动到顶部，然后执行回调函数。

问题是，即使页面已经位于顶部，它仍然会等待“1000”过去后再执行回调，这是我不希望的。

$('html').animate({scrollTop:0}, 1000, 'swing', function(){

//do something

});

Answer 1

它不会等待，

它会从上到下为您的文档添加动画...很有趣，但事实就是这样。你还有其他选择。要么：

• 在滚动之前检查页面位置（正如其他人通过提供一些代码所建议的那样），或者
• 使用一些工作方式不同的 jQuery 插件

我的 .scrollintoview() jQuery 插件 就是这样工作的。它仅在必要时才滚动，并在滚动完成后运行完整的处理程序（如果首先有滚动），或者如果不需要滚动则立即运行。

但它需要一些需要滚动的元素。实际上，您并没有将任何元素滚动到视图中，而只是将 HTML 滚动到视图中。这当然不是最安全的方法。最好使用：

$("html,body")

或

$(window)

它更支持跨浏览器。因此，您的 $("html") 可能不适用于所有这些。

Answer 2

if( $(window).scrollTop() > 0 ) {
    $('html').animate({scrollTop:0}, 1000, 'swing', function(){

        //callback after animate

    });
} else {
    // callback right now (no wait)
}

Answer 3

var html=$('html');
if(html.scrollTop()>0){
  html.animate({scrollTop:0}, 1000, 'swing', function(){
  //do something
});
}else{
  //do something
}