$(window).scroll() firing on page load

Question

Is there a way to prevent $(window).scroll() from firing on page load?

Testing the following code in Firefox 4, it fires even when I unplug the mouse.

jQuery(document).ready(function($){    
$(window).scroll(function(){
                console.log("Scroll Fired");
    });
});

Solution 1

The scroll event is unrelated to the mouse, it is called whenever a new document scrolling position is set. And arguably that position is set when the document loads (you might load it with an anchor after all), also if the user presses a cursor key on his keyboard. I don't know why you need to ignore the initial scroll event but I guess that you only want to do it if pageYOffset is zero. That's easy:

var oldPageYOffset = 0;
$(window).scroll(function(){
  if (window.pageYOffset != oldPageYOffset)
  {
    oldPageYOffset = window.pageYOffset;
    console.log("Window scrolling changed");
  }
});

Note: MSIE doesn't have window.pageYOffset property so the above will need to be adjusted. Maybe jQuery offers a cross-browser alternative.

Solution 2

This was the solution I went for. Any improvements gratefully received.

   var scroll = 0;
    $(window).scroll(function(){
                    if (scroll>0){
                    console.log("Scroll Fired");
                    }
                    scroll++;
    });

Solution 3

The scroll event does not fire on every load, only when refreshing a page that was scrolled, or when navigating to an anchor directly.

Many of the answers suggest ignore the first time it's called, which would ignore a valid scroll if the page doesn't get scrolled initially.

//Scroll the page and then reload just the iframe (right click, reload frame)


//Timeout of 1 was not reliable, 10 seemed to be where I tested it, but again, this is not very elegant.
//This will not fire initially
setTimeout(function(){
  $(window).scroll(function(){
     console.log('delayed scroll handler');
  }); 
}, 10); 

//This will fire initially when reloading the page and re-establishing the scroll position
$(window).scroll(function(){
  console.log('regular scroll handler');
});

div {  
  height: 2000px;
  border: 1px solid red;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div>
</div>

Solution 4

This seems to have worked for me.

$(window).bind("load", function() {
    $(window).on("scroll", function () {
        console.log('scroll');
    });
});

View more solutions

Comments

[Mild Fuzz]

it isn't, the above code is loaded within jQuery(document).ready(function($){

[Mild Fuzz]

This is almost there, I literally just need to prevent the first run!

[Wladimir Palant]

@Mild Fuzz: You will get better answers if you explain what you want to achieve rather than how you want to achieve it. You think that ignoring the first scroll event is the best solution for you but that might not be the case (and impossible to tell if you don't provide more information). Either way, you can also initialize oldPageYOffset with window.pageYOffset if you absolutely want to ignore the initial scroll event.