Force loading image even when not visible

[idoshamun]

I want some images on my website to lazy load without even being inside the viewport.
In simple words, I want to skip elementInView check and force loading the image.

[dinbror]

Hi @idoshamun.
What about the public function, load(), that comes with blazy?

[idoshamun]

It is actually much easier to just pass an option instead of calling the load function and passing the right elements, in my opinion anyway

[dinbror]

Yes :) but how would it know which images to load or not to load outside the viewport. Will you add a specific class or are you looking after a feature like gajus is proposing?

#104

[idoshamun]

#104 could help in other use cases.
I guess what I am aiming for is an option to pass to blazy constructor and every element in the given selector will be load without any relation to the viewport

[dinbror]

I see. But you can do that quite easy with the load function. I want to keep the script as small as possible:

var imagesToLoad = document.querySelectorAll('.force-lazy-load');
var blazy = new Blazy();
blazy.load(imagesToLoad);

[idoshamun]

I'll check this out!

On Wed, Oct 12, 2016, 19:50 dinbror [email protected] wrote:

I see. But you can do that quite easy with the load function. I want to
keep the script as small as possible:

var imagesToLoad = document.querySelectorAll('.force-lazy-load');
var blazy = new Blazy();
blazy.load(imagesToLoad);

—
You are receiving this because you were mentioned.
Reply to this email directly, view it on GitHub
#110 (comment), or mute
the thread
https://github.com/notifications/unsubscribe-auth/AB5qHV7UC9DTeLf7m_JevmQf9Jb4J63sks5qzQ_wgaJpZM4KTSmi
.

[k03n00b]

I think there could be better ways than ele.offsetWidth to check if element is visible or not.
At least (ele.offsetWidth > 0 && ele.offsetHeight > 0) should be changed to (ele.offsetWidth > 0 || ele.offsetHeight > 0), because then it works with visible elements where's only height.

Used multiple hours to solve why my cover image wasn't loaded and loadInvisible did the trick.
I have regular div with CSS background-image for preloading and few floating elements inside it, so offsetWidth is zero, even element is visible and real width for this element is over 600px.

[dinbror]

Hey @k03n00b

Do you have a link. I would like to see what you have done :)
I always reserve the space for an image or background to avoid page reflows when it lazy loads

[dinbror]

Hey @idoshamun

Can I close this one?

[idoshamun]

Yap, if anything new pops up I'll let you know

On Sun, Oct 23, 2016, 21:25 dinbror [email protected] wrote:

Hey @idoshamun https://github.com/idoshamun

Can I close this one?

—
You are receiving this because you were mentioned.
Reply to this email directly, view it on GitHub
#110 (comment), or mute
the thread
https://github.com/notifications/unsubscribe-auth/AB5qHeB2ur_WthMoCrE2RhSpfWdM2ynhks5q26aOgaJpZM4KTSmi
.

[dinbror]

Coolio