How to use JQuery Scroll() method for detect scroll

It is easy to detect scroll events using JQuery scroll() method.

from this link you can find another way of achieving this task.

Completed project can be download from here.

Here is the JavaScript method for detect scroll of page and do some tasks according to the scrolling position and scrolling movements.


    $(window).scroll(function() {
        if($(window).scrollTop() > 0) {
           $('#maincontent').css("background","gray");
        } else {
            $('#maincontent').css("background","white");
            alert("Now you are in the top");
        }
    });



In this code it will change the color of div that has a ID of "maincontent" when user scrolled and in the bottom of the page.

It will alert a message when user comes to the top of the page.

Scroll detection can be used to enhance user experience with your web page in numerous ways.
feel free to add a comment if you have anything unclear of something to add.

No comments:

Post a Comment