Trouble with a comparison

programming web dev
1

I’m trying to detect when the user scrolls to the bottom of a page using jQuery, and this does it:

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

But I want to detect when the window reaches 100px before the bottom of the page. So it would be the same as above, but with - 100 at the end like this:

if ($(window).scrollTop() == $(document).height() - $(window).height() - 100) {...}

Yet this doesn’t work, at all. I’ve tested the code elsewhere and it returns a valid value, so what gives? Anyone know?

2

Just thought I’d share my discovery. JavaScript events don’t fire very fast (JS in general is pretty ■■■■ slow) so when setting trigger points in pixels, never use strict comparisons, ie only use “greater than” etc…

The problem here is fixed by simply replacing the strict equality “==” with “>=”.

[rant]
I keep finding that the hardest problems are the ones with the simplest solutions. Exercise in programming is exercise in mental flexibility! You have to be able to quickly step between the obvious and the subtle :sigh:
[/rant]