Why ScrollTop is always 0?

July 10, 2023

I want to know what is scrollTop and using jQuery. But, it’s always showing 0.

here is my jQuery code:

var scrollTop = $(window).scrollTop()

//onscroll
window.onscroll = function (e) {
    console.log(scrollTop);
}

If need, I can also add HTML and CSS codes.

I try to use JavaScript:

var scrollTop = (window.pageYOffset !== undefined) ? window.pageYOffset : (document.documentElement || document.body.parentNode || document.body).scrollTop;

//onscroll
window.onscroll = function (e) {
    console.log(scrollTop);
}

But, same.

If answer isn’t writed in jQuery it’s better.

>Solution :

The value of scrollTop is not being updated dynamically in the onscroll event handler. Instead, it is only assigned once when the script is initially run.
Maybe this?

Using jQuery:

// onscroll
$(window).scroll(function () {
  var scrollTop = $(window).scrollTop();
  console.log(scrollTop);
});

Plain JS:

// onscroll
window.onscroll = function (e) {
  var scrollTop = window.pageYOffset || document.documentElement.scrollTop || document.body.scrollTop;
  console.log(scrollTop);
};