scrolltop with animate not working

Question

I'm trying to animate while scrolling but no luck with my code...

I have this jquery

$(window).scrollTop(200); 

Now wanted to give animation effect

So tried these but not working:

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

I have applied this in a click function like this:

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

And now I want to give effect of animate but not working...

Answer 1

You have to use $('html,body') instead of $(window) because window does not have a scrollTop property.

$('#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;  }

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>    <div id="top">    <button id="scroll-bottom">scroll</button>  </div>  <div>bottom</div>