Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Animating windows.scrollby in Javascript

So im using the window.scrollby like this

<script> 
function scrollWindowup()   {  
 window.scrollBy(0,700)   
 }  
 function scrollWindowdown()   { 
 window.scrollBy(0,-700)   }
 </script>

is there any way to animate it like move slowy or an offset or any other option ?

thanks in advance

like image 655
user1749105 Avatar asked Oct 16 '12 06:10

user1749105


People also ask

What is difference between scrollTo and scrollBy?

It is not same as scrollTo behavior. It means scrollBy always scrolls up or down further from current position. Or you can say scrollBy scrolls by distance from current pixels. Or you can say scrollBy consider current position as (0,0) and scroll further.

How do you scroll up a page in Javascript?

Method 1: Using window.scrollTo() The scrollTo() method of the window Interface can be used to scroll to a specified location on the page. It accepts 2 parameters the x and y coordinate of the page to scroll to. Passing both the parameters as 0 will scroll the page to the topmost and leftmost point.

What does scrollBy do?

scrollBy() method scrolls the document in the window by the given amount.


1 Answers

From a similar question...

You can animate the scrolltop of the page with jQuery.

$('html, body').animate({
    scrollTop: $(".middle").offset().top
 }, 2000);

Or

$('html, body').animate({
    scrollTop: 700
 }, 2000);

Animating down a page:

$('html, body').animate({
    scrollTop: '+=700'
 }, 2000);

Animating up a page:

$('html, body').animate({
    scrollTop: '-=700'
 }, 2000);

See this site: http://papermashup.com/jquery-page-scrolling/

like image 95
Bill Avatar answered Sep 26 '22 02:09

Bill