Features
- Video.js that is open source HTML5 Flash video player, as well as YouTube and Vimeo (through plugins), used on over 200,000 websites
- Skin with Tube Style
- Retina Ready Fully Responsive
- HTML5 CSS3
- Support videojs-logo / videojs-watermark
- Support keyboard shortcuts: – Up/down arrow or mouse wheel - control volume – Right/left arrow - seek player by 5s – M - toggle mute – F or double click - toggle fullscreen – F or Esc - exits full-screen mode – 0 - restart video – 1-9 - skip to a particular section of the video (e.g., 0 is 0%, 9 is 90% and 5 goes to the video midpoint)
- Support and updates
- Wishlist Support
- Well Documented
Include the skin on the page
The base Video.js skin is made using HTML and CSS. That means you can build a custom skin by simply taking advantage of the cascading aspect of CSS and overriding the styles you’d like to change.
link rel="stylesheet" type="text/css" href="./video-js-5.10.4/video-js.min.css/linklink rel="stylesheet" type="text/css" href="./video-js/videojs-fuzzy.min.css/linkscript type="text/javascript" src="./video-js/video.js" /script
The main class name for all skin-specific styles. To make your own skin, replace all occurrences of ‘vjs-default-skin’ with a new name. Then add your new skin name to your video tag instead of the default skin.
video class="video-js vjs-big-play-centered"
Reference
- VideoJS Player Homepage
- VideoJS Player Documentation
- Learn more about CSS Skinning Guide
- Learn more about Building VideoJS Skins
- Create Custom VideoJS Player
- Icons font generator using SVG files
- PX to EM conversion made simple
- Online CSS Minifier/Compressor
- VideoJS Source Code
- How to build VideoJS from source
Changelog
- Support responsive on mobile – 18 April 2020.
- The launch of the Fuzzy Skin Retina for VideoJS 7 – 23 November 2019.
Other Skins
- Flor – HTML5 Video Player
- Skin for VideoJS: Soccer, Fuzzy, AIR, Flat, Tube
- Skins for JWPlayer: AIR, Flat, Tube, Thin
