Closed robsch closed 3 years ago
The script loads the element 100px before the element is visible, unless you alter the "offset" value. If you have a slideshow or another feature that hides elements off screen then you can load those elements before they are visible by setting "loadInvisible" to true.
hope that helps.
I also am tryng to understand the meaning of this setting. We tried to use it to solve an issue that we had with a slideshow, but the end result is that everything gets loaded, which more or less disable the lazy loading of elements of the page...
@robsch @lems3 If "loadInvisible" is enabled it'll load elements when they are in the viewport even if they're hidden with display: none or visibility: hidden. In a slideshow you need to call either revalidate or load on slide (http://dinbror.dk/blog/blazy/?ref=github#Functions). Blazy is only listening on scroll/resize event
I have to set loadInvisible to true, so that all works as expected. Found it out by chance. But I don't know why. Could anyone describe this option please? Miss some more documentation in general.
In my case there is a table where each row contains an image that should be lazy-loaded. It was working without setting loadInvisible to true until I added a re-ordering of the rows (with jQuery appendTo that removes/detaches (?) a row first if it is already part of the parent), though I called revalidate afterwards. After that all remaining images were not loaded anymore. Scrolling didn't cause lazy-loading anymore.
I'm not sure if the setting is required or if it is just an side-effect. Actually, I wouldn't say that my images are 'invisible'...
Thanks for some explanation.