lazyload doesn't support multiple formats

[MattWilcox]

WebP is an important thing these days; if you're not using it you'll get hurt by Google. Adding webp with a jpg fallback is nice and easy with a < picture > element, but both Picture and multiple file formats don't appear to be something Flickity supports?

`

<source media="(min-width: 1500px)" data-srcset="{{ min1500webp.url }}" type="image/webp">
<source media="(min-width: 1280px)" data-srcset="{{ min1280webp.url }}" type="image/webp">
<source media="(min-width: 960px)"  data-srcset="{{ min960webp.url }}"  type="image/webp">
<source media="(min-width: 700px)"  data-srcset="{{ min700webp.url }}"  type="image/webp">
<source media="(min-width: 480px)"  data-srcset="{{ min480webp.url }}"  type="image/webp">

<source media="(max-width: 479px)"  data-srcset="{{ max479jpg.url }}"  type="image/jpeg">
<source media="(min-width: 1500px)" data-srcset="{{ min1500jpg.url }}" type="image/jpeg">
<source media="(min-width: 1280px)" data-srcset="{{ min1280jpg.url }}" type="image/jpeg">
<source media="(min-width: 960px)"  data-srcset="{{ min960jpg.url }}"  type="image/jpeg">
<source media="(min-width: 700px)"  data-srcset="{{ min700jpg.url }}"  type="image/jpeg">
<source media="(min-width: 480px)"  data-srcset="{{ min480jpg.url }}"  type="image/jpeg">

<img
    loading="lazy"
    class="lazyload"
    data-src="{{ min1280jpg.url }}"
/>

`

Sorry; I do not know why Github isn't displaying the code above correctly - seems to choke on picture tags.

[desandro]

Thanks for reporting this issue. I'm tracking this in #172

[kbav]

@desandro I think you're technically tracking this with #161 . Commenting to leave a breadcrumb trail for whoever else may be looking for <picture> tag and/or multi-format / webp support.