How to detect Scroll position of a webpage using jQuery's .scrollTop()

The .scrollTop() function in jQuery allows you to get the current vertical position of the scroll bar for the first element in the set of matched elements or set the vertical position of the scroll bar for every matched element.

You can extract the scroll position of a certain page or element using the jQuery's .scrollTop() method.

$(window).scroll(function (event) {
    var scroll = $(window).scrollTop();
    // Do something
});

You can also determined the percentage and alert the user that he has scrolled certain amount within the document.

$(document).scroll(function(e){
 
    // get the scroll value and the document height
    var scrollVal = $(window).scrollTop();
    var docHeight = $(document).height();
 
    // calculate the percentage when the user scrolls down the page
    var percentage = (scrollVal / docHeight) * 100;
 
    if(percentage > 50) {
        // call the function called alertUser
        alertUser(percentage);
    }
 
    function alertUser(scrollPercentage) {  
        // alerts the user that he has scrolled certain amount within the document
        alert("You have scrolled down at " + scrollPercentage + " of this page");
    }
 
});