Waypoints JS bottom-in-view, is there a top-in-view?

Question

Im using waypoints js to detect when an element is in the viewport.

http://imakewebthings.com/jquery-waypoints/

https://github.com/imakewebthings/waypoints

Is it possible to detect when the top of an element is at the bottom of the viewport?

Cheers

Ke

Answer 1

Nobody has given a correct answer yet, so here is mine.

As you already know, the Waypoint plugin has an offset option. This option triggers the handler function after either the top or bottom of your element has passed either the top or bottom of the viewport.

The offset value as a percentage represents the height of the viewport where you want the function to fire - 0% being right at the top, 50% in the middle, and 100% right at the bottom.

To fire your handler function when the top of your element immediately comes into view, you will need to use 100%, like this:

$('.sections').waypoint({
    handler: function(direction) {
        // do stuff
    },
    offset: '100%'
});