Plyr: A simple HTML5 media player with custom controls and WebVTT captions
Plyr is a simple HTML5 media player with custom controls and WebVTT captions made by @sam_potts
Download Plyr on GitHub or get access to implementation procedures and other options.
Features
- Accessible – full support for captions and screen readers.
- Lightweight – just 6.4KB minified and gzipped.
- Customisable – make the player look how you want with the markup you want.
- Semantic – uses the right elements. for volume and
- Responsive – as you’d expect these days.
- Audio & Video – support for both formats.
- API – toggle playback, volume, seeking, and more.
- Fullscreen – supports native fullscreen with fallback to “full window” modes.
- And the best feature in my opinion: No dependencies – written in vanilla JavaScript, no jQuery required.
Here’s a demo of Plyr ( created without editing my templates to include javascripts and css in the header. All code is in the post ):