Do something 100px before the scrollbar reaches bottom

Question

I have the below Javascript, and the alert shows up as it is supposed to when the scrollbar hits the bottom of the page.

However, I would like this to happen 100 pixels before it reaches the bottom. How would I do that?

$(window).scroll(function(){
  if($(window).scrollTop() == $(document).height() - $(window).height() ){

    alert("at bottom");

  }
}

score 11 · Accepted Answer · answered Jun 02 '11 at 19:50

11

$(window).scroll(function(){
  if($(window).scrollTop() + 100 > $(document).height() - $(window).height() ){

    alert("at bottom");

  }
});

Using > instead of == because the scroll event fires sporadically, so you may scroll past that value a bunch of times without the event ever firing when there's a precise match.

answered Jun 02 '11 at 19:50

RwwL

3,298
1
23
24

1

This solution fires multiple time in IE. – usefulBee Aug 27 '15 at 15:02
@usefulBee Yeah, I was leaving it up to the developer to determine if the planned action has already been taken or not. This solution is just about figuring out whenever you're in the targeted scroll position. – RwwL Aug 28 '15 at 09:23

Do something 100px before the scrollbar reaches bottom

1 Answers1

Linked