`<picture>` tag support
lenovouser opened this issue · comments
Describe the feature
Most of my current projects use <picture> tags with different sizes and image codecs (WebP / JPG / PNG etc.) and I would love to be able to use unlazy for them, but it seems like currently only the <img> tag is supported.
Additional information
- Would you be willing to help implement this feature?
- Can you think of other implementations of this feature?
Final checks
- Check existing issues.
Hi there!
Happy to hear when people intend to use unlazy. Have you taken a look into the Usage Guide?
There is a section on <picture> tag support:
Edit:
If you run into issues using one of the framework integration, feel free to open a descriptive separate issue. Closing this for now, since <picture> tags are supported.
Yeah, my bad, didn't see the 2nd tab. Still figuring out why it doesn't work currently, will open another issue if it's the library, but most likely I am just doing something wrong.
Yeah, the tab seems hidden a bit. 🙈
I hope you get your issues resolved!
I found it, it apparently does not run when there is no native src attribute on the <img> inside the <picture>. I just had data-src and data-srcset on there.
Just set it to a blank base64 encoded 1×1 PNG and then it started working. I guess I need to put a thumbhash/blurhash in there?
@johannschopplich I have an issue with unlazy loading two images for each element, instead of just loading one. I moved it out of my project and did a minimal example to reproduce it, and it still seems to happen. Is this a bug in unlazy or am I missing something?
Safari:
Chrome:
