How to lazy load this image?

Solved
Highlighted
Tourist
11 0 1

still struggling with prelaoding of background images - i can preload the div.. but its not preloading the actually image..

 


{% else %}
<div class="slideshow__image box ratio-container lazyload {% unless forloop.first %} lazypreload{% endunless %} js"
data-scr="{{ block.settings.image | img_url: '300x300' }}"
data-src="{{ img_url }}"
data-widths="[180, 360, 540, 720, 900, 1080, 1296, 1512, 1728, 2048]"
data-aspectratio="{{ image.aspect_ratio }}"
data-sizes="auto"
data-parent-fit="contain"
style="background-position: {{ block.settings.alignment }};
background-image: url('{{ block.settings.image | img_url: '1024x1024' }}');">
{% if section.settings.show_overlay %}<div class="slideshow__overlay"></div>{% endif %}
</div>
{% endif %}

 

0 Likes