Web Component with progressive enhancements for the HTML <video> element
npm install @webfactoryde/video-utils
The <video-utils> Web Component is meant to be a lightweight wrapper and progressive accessibility enhancement for <video> elements that autoplay muted background video.
It implements a media query for prefers-reduced-motion: reduced and prevents autoplay if the media query matches.
- The JS file "video-utils.js" must be loaded. Depending on browser support requirements, transpilation for older browsers is recommended.
- Wrap your
<video>with<video-utils>.