Closed SkyHolder closed 5 years ago
Sorry, i figure out my mistakes. partially Now, if i use code like this
<picture class="lazy">
<data-src srcset="{{look.image.path|resize(228, 342, {mode:'crop'})}}, {{look.image.path|resize(456, 684, {mode:'crop'})}} 2x" media="(max-width: 460px)" type="image/jpeg"></data-src>
<data-src srcset="{{look.image.path|resize(600, 900, {mode:'crop'})}}, {{look.image.path|resize(1200, 1800, {mode:'crop'})}} 2x"></data-src>
<data-img src="{{look.image.path|resize(228, 342, {mode:'crop'})}}" >
<source srcset="{{look.image.path|resize(228, 342, {mode:'crop'})}}">
<img src="{{look.image.path|resize(6, 9, {mode:'crop'})|base64}}">
</picture>
it show blurred images, but after loading , the elements and
Why do you use data-img
and img
inside the picture
? Remove the img
, Lazy wil handle it for you.
I add a small blurry image so that it appears immediately when the page loads, when the script does its work, the main image is shown. with tag img it works fine
Hi, i use plugin picture like this
i using small blurred image for placeholder and for simple img tag it work great, but in case with
i do little update for your script and it work nice.