I am looking for advice on how to create an autoscrolling effect using jQuery which would enable an entire div within a page to begin scrolling vertically upon loading at a constant slow speed. This would be a div with a large amount of content of which only a small amount was visible on the screen at any one time.

The scroll needs to be automatic, smooth and at a defined rate for example 10 pixels per second. Additionally when the scroll gets to the bottom of the page I need to be able to call a function.

I have tried a few different jQuery plugins but found nothing yet that worked reliably. Can anybody suggest an approach to take here?

Thanks

Simon

I am looking for advice on how to create an autoscrolling effect using jQuery which would enable an entire div within a page to begin scrolling vertically upon loading at a constant slow speed. This would be a div with a large amount of content of which only a small amount was visible on the screen at any one time.

The scroll needs to be automatic, smooth and at a defined rate for example 10 pixels per second. Additionally when the scroll gets to the bottom of the page I need to be able to call a function.

I have tried a few different jQuery plugins but found nothing yet that worked reliably. Can anybody suggest an approach to take here?

Thanks

Simon

• javascript
• jquery

3 Answers 3

This can easily be done without jquery.

function init() {

    var div = document.getElementById("myDiv");

    // increase the scroll position by 10 px every 10th of a second
    setInterval(function() { 
        // make sure it's not at the bottom
        if (div.scrollTop < div.scrollHeight - div.clientHeight)
            div.scrollTop += 10; // move down
    }, 100); // 100 milliseconds

}

Try this technique

try this plugin : scrollTo

especially the onAfter