Description
Hi, firstly, great plugin, I love it.
I have an element that starts both off the page and hidden (ng-hidden). After some user interaction this is un-hidden and brought into view (other things on the page get hidden). However inview detects it as being "in-view" right from the start (or certainly from the first scroll, even when the hidden element is still far from the bottom of the viewport), so when it actually comes into view the event is not triggered.
I made a gist to give you the idea here: https://jsbin.com/yahovejexi/1/edit?html,js,output
Looking at the code I can fix this by changing lines 96-98 like so:
var isVisible = !!(element[0].offsetWidth || element[0].offsetHeight || element[0].getClientRects().length);
var info = {
inView: isVisible && intersectRect(elementRect, viewportRect),
The new var isVisible
uses the same code as jquery to check if an element is visible ($(el).is(':visible')
). And then if not visible then inView
always returns false.
This is exactly the behaviour I want, and I'm happy to PR it, but does this work for everyone else?