Offset for lazy load images

Hello, first of all I would like to say that Frontity is a really cool framework, great work guys!

My question: Is there an option for an offset to load the image for example 1000px below viewport? I want to use gsap and scrolltrigger for scrollanimations, therefore the images should be loaded before the animation begins.

Frontity doesn’t do any magic other than letting the browser handle the lazy loading (read https://web.dev/browser-level-image-lazy-loading/ to learn how it works).

Can I change how close an image needs to be before a load is triggered? #
These values are hardcoded and can’t be changed through the API. However, they may change in the future as browsers experiment with different threshold distances and variables.

So what you could do is add some client-side javascript which checks for images with loading="lazy", and set them to loading="eager" at the offset you prefer.

@Johan Thank you for your help! I solved it with native lazy loading and react-intersection-observer as fallback:

1 Like