Search code examples
offsetinfinite-scrolljquery-waypoints

Waypoints Infinite Scroll - trigger above 'bottom-in-view'

I'm using the Waypoints shortcut "Infinite Scroll" to create an infinite scroll with pagination on my website (API here). My problem is this: I want to load the data from the next page BEFORE the window actually hits the bottom of the page.

Currently, if I use

offset: 'bottom-in-view'

Everything works, except it only triggers when the window hits the very bottom.

If I use any of the other options for "Offset", it results in EVERY page being loaded at once when it triggers, rather than page by page.

Is there any way to make it so that I can have 'bottom-in-view' + 'x' pixels?

Thanks!

Solution

  • I know this answer is probably a little bit late but I just found a solution to this problem.

    You can calculate an offset with a callback function.

    offset: function(){
    return -$(this).height() + $(this).height() / 10;
}

    This makes the waypoint trigger when the user scrolls into the last thenth of your page.