HTML5 Video Media Queries


<video playsinline controls>
  <source src="tiny.mp4" type="video/mp4" media="(max-width:480px)">
  <source src="tiny.webm" type="video/webm" media="(max-width:480px)">
  <source src="big.mp4" type="video/mp4">
  <source src="big.webm" type="video/webm">
</video>

Note: Video media query support has been removed from Google Chrome 34+

W3C Recommendation for the HTML5 video media attribute

Video source: Sintel, the Durian Open Movie Project

Page by: Walter Ebert