Question

I’m running an if function when the user gets to the bottom of the page which works great as is like this

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

However I want it to run slightly before the bottom – about 300px before.

I’ve tried

if($(window).scrollTop() + $(window).height() + 300 == $(document).height()) {}

AND

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

and all other variations to no avail.

I’ve also tried putting variables in.

var plusheight = 300;

if($(window).scrollTop() + $(window).height() + plusheight == $(document).height()) {}
if($(window).scrollTop() + $(window).height() + $plusheight == $(document).height()) {}
if($(window).scrollTop() + $(window).height() + "plusheight" == $(document).height()) {}

What am I doing wrong?

Answer 1

Use an inequality. It’s quite possible the user’s scrolltop is jumping right past the exact value you’re comparing with.

if($(window).scrollTop() + $(window).height() >= $(document).height() -300) {}