title | date | submitter | tags | discussion | ||
---|---|---|---|---|---|---|
I want media query support in `video` `source` elements |
2019-07-25 00:00:00 UTC |
Alastair Coote |
|
The picture
element lets you provide different images to the user based on a media query attached to a source
element. It's a great way to save user bandwidth when your image differs at different viewports (for example, serving a wide image on desktop and a square one on mobile). However, attaching a media query to a video
source
does not do the same thing, it just plays whichever source
is specified first. We are using muted, autoplay videos more and more and right now we have to render an empty div
tag then fill with a video
via JavaScript after page load.
Here’s an example published from the New York Times and another on Glitch.
It would be amazing to not have to script this at all and just let the video
element work it out for us.