search

aFarkas / lazysizes

High performance and SEO friendly lazy loader for images (responsive and normal), iframes and more, that detects any visibility changes triggered through user interaction, CSS or JavaScript without configuration.
MIT License
17.53k stars 1.73k forks source link

Lazysizes with Slick Carousel load all images #793

Open amoralesdesign opened 4 years ago

amoralesdesign commented 4 years ago

I don't understand why using the vue-slick component loads all the images only in my product sheets: https://wanapix.co.uk/personalised-ceramic-mug To check this, use the Chrome inspector and click on network, search for "582" and you will see the images that I try to hide with lazysizes. Captura de pantalla 2020-06-02 a las 16 41 39

However in mobile mode it works well, only the first 3 images of the slider are loaded.

And curiously enough, it also works on my desktop at home: https://wanapix.co.uk

I don't understand the behavior, I've tried everything. I even disabled the Lazysizes init and waited to use it manually when loading slick carousel. But it doesn't work.

`<slick-carousel class="slider-for" ref="slick_carousel" :options="slickOptions" @if(Input::has('dsn')) :design_image="'{{ FuImg::dsn(Input::get('dsn')) }}'" @endif

`

Gitsko commented 3 years ago

@amoralesdesign do you found a solution ?