Slick: Lazy-load images not replaced on cloned slicks-slide

Created on 9 Oct 2017  路  1Comment  路  Source: kenwheeler/slick

When you set infinite carousel and you have lazyloaded images, the src attribute of cloned elements aren't replace with the image at load.

DEMO

http://jsfiddle.net/w6z6c53y/

====================================================================

Steps to reproduce the problem

Set data-lazy intead of src in the image inside the slide, set infinite carousel, scroll on the next slides.

====================================================================

What is the expected behaviour?

No image swap

====================================================================

What is observed behaviour?

When the cloned slide enter from the right side, the images are not showed. The images return visible when the slide swaps on the real one.

====================================================================

FIX:

            imageToLoad.onload = function() { 
                 [...]rest of the function

                //REPLACE LAZYLOAD ON CLONED SLICK
                $(".slick-cloned [data-lazy='" + imageSource  + "']").attr("src", imageSource).removeAttr('data-lazy data-srcset data-sizes');                    
            };

Most helpful comment

First of all thanks a lot for this awesome slider, I really appreciate it.

I am experiencing this issue as well, it would be great if you guys could fix this.

>All comments

First of all thanks a lot for this awesome slider, I really appreciate it.

I am experiencing this issue as well, it would be great if you guys could fix this.

Was this page helpful?
0 / 5 - 0 ratings

Related issues

rahi-rajeev picture rahi-rajeev  路  3Comments

stephane-r picture stephane-r  路  3Comments

niccih picture niccih  路  3Comments

barzev picture barzev  路  3Comments

crstauf picture crstauf  路  3Comments