有效的无法工作的scrolltop

我正在尝试滚动动画，但我的代码没有运气…

我有这个jquery

$(window).scrollTop(200); 

现在想给动画效果

所以试过这些但不起作用：

 1. $(window).animate({scrollTop:200},1000); 2. $('body').animate({scrollTop: 200}, 1000); 

我已经在这样的点击function中应用了这个：

 $('.goto').click(function(){ $(window).scrollTop(485); // its working }); 

而现在我想要制作动画而不是工作……

Answer 1

你必须使用$('html,body')而不是$(window)因为window没有scrollTop属性。

 $('#scroll-bottom').on('click', function() { $('html, body').animate({ scrollTop: 2000 }, 2000); // for all browsers // $('html').animate({scrollTop: 2000}, 2000); // works in Firefox and Chrome // $('body').animate({scrollTop: 2000}, 2000); // works in Safari }) 

 #top { margin-bottom: 2000px; } 

  
 scroll 
 
bottom 

Answer 2

如果你有html和身体风格高度：100％; 它不起作用

 height: auto; min-height: 100%; 

Answer 3

DEMO

  function scrollmetop(dest){ var stop = $(dest).offset().top; var delay = 1000; $('body,html').animate({scrollTop: stop}, delay); return false; } scrollmetop('#test');  
 
target object
 
   

Answer 4

我正在使用Angular并且正在尝试向下滚动到已在ng-repeat中添加的项目。 我把这个代码放在$timeout （零时间，只是为了让它在显示的元素之后发生），这足以让新项目有一个offset().top …

…但我认为添加几十个新元素的方式太多了，所以它没有滚动动画的处理能力。 当我将超时时间设置为1秒时，它可以工作（尽管它实际上需要7秒才能调用超时）。

我的结论是，动画，平滑滚动在这里不会真正易处理，而是我只是使用

 document.body.scrollTop = entry.offset().top 

Answer 5

你只需要添加像素

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