Continuous scrolling page using javascript

Question

I am trying to repeat an animation where a page automatically scrolls to the bottom. When it reaches the bottom I want it to then scroll to the top. Then, repeat forever. However, I can't get it to even perform the first callback. Any help would be greatly appreciated.

Code:

pageScroll(pageScrollUp);





function pageScroll(callback) {
    window.scrollBy(0,1); // horizontal and vertical scroll increments
    scrolldelay = setTimeout('pageScroll()',50); // scrolls every 100 milliseconds

    callback(pageScroll);

}


function pageScrollUp(callback) {

    window.scrollBy(0,-1); // horizontal and vertical scroll increments
    scrolldelay = setTimeout('pageScroll()',50); // scrolls every 100 milliseconds

    callback(pageScrollUp);

}

Thanks Josh

John_C · Accepted Answer · 2019-09-13 13:55:24Z

4

This should do it: http://jsfiddle.net/John_C/8ZfKr/

var scrollDirection = 1;
function pageScroll() {
    window.scrollBy(0,scrollDirection); // horizontal and vertical scroll increments
    scrolldelay = setTimeout('pageScroll()',50); // scrolls every 50 milliseconds
    if ( (window.scrollY === 0) || (window.innerHeight + window.scrollY) >= document.body.offsetHeight) {
        scrollDirection = -1*scrollDirection;
    }
}
pageScroll();

edited Sep 13, 2019 at 13:55

answered Jul 20, 2014 at 13:39

John_C

1,1968 silver badges17 bronze badges

Sign up to request clarification or add additional context in comments.

5 Comments

Josh Over a year ago

Worked perfect! Is there an easy way to pause at the top and bottom?

John_C Over a year ago

inside the if statement you could clear the scrolldelay timeout and re-start it after a delay.

Josh Over a year ago

scrollDelay = 0; setTimeout(scrollDelay = 50,1250);

Josh Over a year ago

While this clearly works in your example, it only manages to scroll faster rather than pause for me. I will continue to play with it. Thanks for the help.

Jarom Over a year ago

One of the comments is a little off. It should say it's scrolling 1px pixel every 50 milliseconds, not every 100 milliseconds.

Collectives™ on Stack Overflow

Continuous scrolling page using javascript

1 Answer 1

5 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

5 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related