Detecting webpage scroll with javascript

Question

I'am trying to detect the scroll of a web page using JavaScript

I want to get an alert once only when the page is at top or not

var top = true;
      
    $(window).on('scroll', function () {
      
      if (window.scrollY > 0 && top==true) {
        top = false;
       alert("not top");
      }else if (window.scrollY == 0 && top==false){
       top = true;
       alert("top");
      }     
 });

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

The above code is not triggering alert at all !

See this answer please @fraizor https://stackoverflow.com/a/16433490/3617531 — Alejandro Teixeira Muñoz, Oct 06 '19 at 18:10

neha soni · Answer 1 · 2019-10-06T18:24:50.520

-1

The problem here is top is a javascript global variable which is conflicting with your variable. Your solution will work if you use another variable. If you just want an alert when the window is scrolled to the top then you can use the following solution -

$(window).on('scroll', function () {
    if(window.pageYOffset === 0) {
        alert("top");
    }
})

edited Oct 06 '19 at 18:24

answered Oct 06 '19 at 18:09

neha soni

221
3
12

1

Good answers are more than just "this should work", they explain what the problem is and how the solution solves it. – Scott Marcus Oct 06 '19 at 18:10
@ScottMarcus Sorry, I will be editing the answer. Thanks for pointing out. – neha soni Oct 06 '19 at 18:19

Detecting webpage scroll with javascript

1 Answers1