# Video.js v10

> Modern video player framework with multi-platform support

## Documentation

### Html + CSS

- [Architecture](/docs/framework/html/style/css/concepts/architecture): Understanding the three-tier architecture of Video.js v10 - State, UI, and Renderers
- [Skins](/docs/framework/html/style/css/concepts/skins): Understanding skins in Video.js v10 - packaged sets of UI components and styles
- [UI Components](/docs/framework/html/style/css/concepts/ui-components): Understanding Video.js v10's primitive-based component architecture
- [v10 Roadmap](/docs/framework/html/style/css/concepts/v10-roadmap): Timeline and milestones for Video.js v10 rebuild and the future of v8
- [Customize Skins](/docs/framework/html/style/css/how-to/customize-skins): Learn how to customize Video.js v10 skins by copying and modifying them
- [Installation](/docs/framework/html/style/css/how-to/installation): Get started with Video.js v10 by choosing your framework, styles, skin, and media renderer
- [fullscreen-button](/docs/framework/html/style/css/reference/fullscreen-button): A button component for toggling fullscreen mode
- [mute-button](/docs/framework/html/style/css/reference/mute-button): A button component for toggling audio mute state
- [play-button](/docs/framework/html/style/css/reference/play-button): A button component for playing and pausing media playback
- [time-slider](/docs/framework/html/style/css/reference/time-slider): A slider component for seeking through media content
- [volume-slider](/docs/framework/html/style/css/reference/volume-slider): A slider component for controlling media volume

### React + CSS

- [Architecture](/docs/framework/react/style/css/concepts/architecture): Understanding the three-tier architecture of Video.js v10 - State, UI, and Renderers
- [Skins](/docs/framework/react/style/css/concepts/skins): Understanding skins in Video.js v10 - packaged sets of UI components and styles
- [UI Components](/docs/framework/react/style/css/concepts/ui-components): Understanding Video.js v10's primitive-based component architecture
- [v10 Roadmap](/docs/framework/react/style/css/concepts/v10-roadmap): Timeline and milestones for Video.js v10 rebuild and the future of v8
- [Customize Skins](/docs/framework/react/style/css/how-to/customize-skins): Learn how to customize Video.js v10 skins by copying and modifying them
- [Installation](/docs/framework/react/style/css/how-to/installation): Get started with Video.js v10 by choosing your framework, styles, skin, and media renderer
- [FullscreenButton](/docs/framework/react/style/css/reference/fullscreen-button): A button component for toggling fullscreen mode
- [MuteButton](/docs/framework/react/style/css/reference/mute-button): A button component for toggling audio mute state
- [PlayButton](/docs/framework/react/style/css/reference/play-button): A button component for playing and pausing media playback
- [TimeSlider](/docs/framework/react/style/css/reference/time-slider): A slider component for seeking through media content
- [VolumeSlider](/docs/framework/react/style/css/reference/volume-slider): A slider component for controlling media volume

## Blog Posts

- [Video.js 8 and Video.js HTTP Streaming 3](/blog/videojs-8-and-vhs-3): Video.js 8 and VHS 3 drop IE support and ES5 transpilation for 3-4% size reduction, introduce new TitleBar component with loadMedia metadata support, reorganize utilities into videojs.dom/fn/num/obj/str/time/url objects, and target evergreen browsers plus Chromium 53 for Smart TV compatibility.
- [Announcing the new Videojs.com](/blog/announcing-the-new-videojs-com): Video.js unveils completely redesigned website with new logo, four CSS-only customizable themes showcasing player framework philosophy, unified root domain, Mux-funded development, and renewed focus on empowering builders to create custom video experiences.
- [In-band Captions Support with videojs-http-streaming](/blog/inband-captions-support-with-vhs): VHS 1.2.0 introduces built-in CEA-608 caption parsing from FMP4 segments for HLS and MPEG-DASH using mux.js CaptionParser, automatically extracting caption streams and converting to VTTCue format for Video.js TextTrack API integration.
- [Video.js 7.4](/blog/video-js-7-4): Video.js 7.4 debuts experimental live UI enabling seekable live streams with time display relative to live point, adds 14 first-time contributors, removes Grunt for npm scripts, updates focus-visible menu backgrounds, implements replay option, and expands to six new translations.
- [Bugpost: Disconnects and Reconnects](/blog/bugpost-disconnects-and-reconnects): Video.js debugging journey fixes DASH network disconnect issues by comparing currentTime on timeupdate to prevent premature loading spinner removal, throttling final playlist retries to prevent console crashes, and fixing media-segment-request abort callbacks for init segments.
- [Introducing Video.js HTTP Streaming (VHS)](/blog/introducing-video-js-http-streaming-vhs): Video.js HTTP Streaming (VHS) debuts as successor to videojs-contrib-hls, adding DASH support with shared codebase, bundled by default in Video.js 7 for cross-browser HLS and DASH playback without external plugins, with opt-out via core build.
- [Video.js 7.3: Responsive Layout, Fill Mode, createLogger](/blog/video-js-7-3-responsive-layout-fill-mode-createLogger): Video.js 7.3 introduces Responsive Mode using playerresize event to apply breakpoint classes like vjs-layout-small for adaptive UI, promotes Fill Mode to first-class feature for contained resizing, and adds createLogger method for hierarchical plugin debugging.
- [Video.js 7.1 and 6.11: Autoplay and Fullscreen changes](/blog/video-js-7-1-and-6-11-autoplay-and-fullscreen-changes): Video.js 7.1 and 6.11 expand autoplay option with muted, play, and any values for better browser policy compatibility, implement double-click fullscreen toggling outside control bar, disable fullscreen button in unsupported contexts, and show mute toggle on iOS.
- [Video.js 7 is here! 🎉](/blog/video-js-7-is-here): Video.js 7 officially launches with VHS bundled for HLS and experimental DASH support, drops IE8-10 to enable modern CSS selectors and reduce code, provides core build without VHS, removes Google Analytics from CDN, deprecates 5.x, and plans future roadmap.
- [Autoplay Best Practices with Video.js](/blog/autoplay-best-practices-with-video-js): Video.js autoplay best practices recommend never assuming autoplay succeeds, using muted attribute to improve success rates, preferring programmatic player.play() over autoplay attribute, and handling Promise rejection to detect when browsers block autoplay.
- [videojs-contrib-ads 6](/blog/videojs-contrib-ads-6): videojs-contrib-ads 6 refactors state machine to match strict ad mode definition where content playback is blocked, introducing separate content and ad states, with Redispatch preventing extra media events and maintaining plugin compatibility.
- [Video.js 7 Roadmap](/blog/video-js-7-roadmap): Video.js 7 roadmap announces VHS (videojs-contrib-hls successor) bundled by default for plug-and-play HLS/DASH, drops IE8-10 support saving 5-10 minutes in test time, deprecates 5.x, removes Google Analytics tracking from CDN, and transitions from Rollup to Webpack 4.
- [videojs-vr Is Now Under The Video.js Org](/blog/videojs-vr-now-under-the-video-js-org): Video.js officially adopts videojs-vr as first-class plugin with Video.js 6 support, using three.js canvas with webvr-polyfill for 360/VR playback across equirectangular and cube projections, supporting VIVE, Oculus, and Google Cardboard.
- [Video.js 6.7.1 released](/blog/video-js-6-7-1-released): Video.js 6.7.1 delivers working playerresize event using ResizeObserver with iframe fallback, mediator middleware for play/pause cancellation, getPlayer/getAllPlayers helpers to prevent duplicate initialization, and Netlify migration enabling HTTPS and automated PR previews.
- [Video.js 6.5.0 Release](/blog/video-js-6-5-0-release): Video.js 6.5.0 introduces <video-js> element for simpler embedding without requiring <video> tag, implements smooth progress bar animation, fixes major memory leaks with retained DOM elements, and restricts seek/playback toggling to left-click only.
- [Video.js 6.4.0 Release](/blog/video-js-6-4-0-release): Video.js 6.4.0 celebrates community growth with 27 pull requests from 13 authors including seven first-time contributors, adding Hebrew translations, disableable progress control, hookOnce method, Google Analytics transparency documentation, and DOM presence warnings.
- [Video.js 6.0 Release!](/blog/video-js-6-0-release): Video.js 6.0 officially releases with enhanced accessibility for controls and components, Flash removal from core, middleware for tech-player communication, advanced plugins with React-inspired architecture, asynchronous source selection, and Code of Conduct adoption.
- [Feature Spotlight: Middleware](/blog/feature-spotlight-middleware): Video.js 6.0 middleware enables Express-like routing based on MIME types, supporting dynamic source handling for video catalogs, server-side ad insertion timeline manipulation, and playback rate adjustment through tech-player intercept points.
- [Video.js removes Flash from core player](/blog/video-js-removes-flash-from-core-player): Video.js 6.0 removes Flash from core player following Chrome, Safari, and Firefox's deprecation steps, moving it to separate videojs-flash plugin to reduce legacy code and minimize player footprint while maintaining backwards compatibility.
- [Feature Spotlight: Accessibility](/blog/feature-spotlight-accessibility): Video.js 6.0 fixes critical accessibility regression by replacing VolumeMenuButton's nested control structure with VolumePanel, restores visual keyboard focus outlines, and implements proper ARIA attributes for screen reader support including role, aria-live, and control text.
- [Feature Spotlight: Advanced Plugins](/blog/feature-spotlight-advanced-plugins): Video.js 6.0 introduces advanced plugins with class-based architecture reminiscent of components, featuring lifecycle management through dispose events, React-inspired statefulness, evented communication channels, and player awareness methods hasPlugin and usingPlugin.
- [Video.js 6.0.0-RC.0: The first Release Candidate](/blog/video-js-6-0-0-rc-0-the-first-rc): Video.js 6.0.0-RC.0 removes Flash from core, introduces React-inspired plugin architecture, recommits to accessibility with volume control fixes and visible outlines, and debuts middleware feature for interfacing between techs and player.
- [Introducing Thumbcoil](/blog/introducing-thumbcoil): Thumbcoil debuts as an open-source suite of tools for inspecting H.264 video bitstreams within MP4 and MPEG2-TS containers, using parser combinators to decode NAL units, parameter sets, and slice headers for debugging Mux.js transmuxer output.
- [Video.js 5.12.0 and 5.11.5 releases](/blog/video-js-5-12-0-and-5-11-5-releases): Video.js releases 5.11.5 stable and 5.12.0 pre-release with comprehensive codebase linting, ES5 source file exposure for webpack/browserify bundling, Node.js requiring support, and preparation for automated changelog generation with standard-version.
- [The End of "HTML-First"](/blog/the-end-of-html-first): Video.js announces plans to remove Flash from core and transition from "HTML-first" to "HTML-only" by December 2016, coinciding with Chrome's Flash deprecation, to focus on HLS, DASH, and modern plugin architecture improvements.
- [Video.js 5.11.0 Prelease](/blog/video-js-5-11-0-prelease): Video.js 5.11.0 pre-release un-deprecates videojs.players property, enables waiting for source before playback, improves caption settings accessibility, but includes known MPEG-DASH compatibility issues requiring investigation.
- [Video.js 5's fluid mode and playlist picker](/blog/video-js-5-s-fluid-mode-and-playlist-picker): Video.js 5.0's fluid mode uses intrinsic ratios for responsive layouts, with a detailed tutorial on combining flexbox and dimension classes to create perfectly aligned playlist pickers that scale alongside video players.
- [Video.js 5: The only thing that's changed is everything (except for like 3 things that didn't, including the name)](/blog/video-js-5-the-only-thing-that’s-changed-is-everything-except-for-like-3-things-that-didn-t-including-the-name): Video.js 5.0 features a completely redesigned UI with flex-box controls, ES6 codebase compiled with Babel, switched from Less to Sass, and represents 146 merged pull requests from 25 contributors updating nearly every line of code.
- [It's here: 5.0 release candidates!](/blog/it-s-here-5-0-release-candidates): Video.js 5.0 release candidate debuts with redesigned base theme, ES6/Babel transpilation, Browserify integration with NPM packages, earlier plugin initialization for greater control, and community testing to ensure production readiness.
- [Video.js 4.12 - The last of the 4 minors](/blog/video-js-4-12-the-last-of-the-4-minors): Video.js 4.12, the final 4.x minor release, integrates Mozilla's VTT.js for dramatically improved WebVTT accessibility, grows to 19 community translations, and appears on Instagram, Twitter, Tumblr, Wall Street Journal, Guardian, and Bloomberg.
- [Video.js 4.9 - Now <audio> can join the party!](/blog/video-js-4-9-now-can-join-the-party): Video.js 4.9 introduces HTML5 audio tag support with persistent poster display and always-visible controls for audio player experience, plus five new translations including Brazilian Portuguese, Japanese, Italian, French, and Korean.
- [Video.js 4.8.0 released...Prost!](/blog/video-js-4-8-0-released-prost): Video.js 4.8.0 delivers scheduled maintenance with German translation, configurable inactivity timeout, improved keyboard event handling, and Heavybit Industries' impressive implementation featuring video-synchronized transcripts.
- [Video.js v4.7.0 - Built Mostly by New Contributors, Also Google Chooses Video.js](/blog/video-js-v4-7-0-built-mostly-by-new-contributors-also-google-chooses-video-js): Video.js 4.7.0 marks a community milestone with over half the changes from new contributors, Google selects Video.js for their Media Framework with IMA integration, localization infrastructure launches, and Team Coco adopts the player with custom branding.
- [DASH Everywhere-ish (hack project)](/blog/dash-everywhere-ish-hack-project): Brightcove hackweek produces MPEG-DASH support for Video.js by combining Dash.js and Dash.as implementations, enabling adaptive streaming across browsers through Media Source Extensions and Flash fallback, though iOS support remains unavailable.
- [Video.js version 4.6.0 released! It's been a productive month.](/blog/video-js-version-4-6-0-released-it-s-been-a-productive-month): Video.js 4.6.0 delivers major UX improvements with live streaming UI, clearer error messaging, IE11 fullscreen support, optional playback rate controls, and Addy Osmani's Polymer element integration showcasing vibrant community contributions.
- [Video.js version 4.5.0 released! Nothing to see here, move along](/blog/video-js-version-4-5-0-released-nothing-to-see-here-move-along): Video.js 4.5.0 streamlines the release process for faster delivery, adds Component(1) package manager support, fixes caption positioning when controls hide, and enables Android HLS detection while improving GitHub issue response times.
- [Video.js version 4.4.0 released - Now supporting RequireJS and Browserify](/blog/video-js-version-4-4-0-released-now-supporting-requirejs-and-browserify): Video.js 4.4.0 introduces AMD and CommonJS module support for RequireJS and Browserify, enables NPM installation with upcoming Bower and Component support, and debuts five new community plugins including The Onion's endcard solution.
- [The Guardian uses Video.js in feature article](/blog/the-guardian-uses-video-js-in-feature-article): The Guardian's interactive Snowden NSA surveillance article showcases innovative Video.js implementation with scroll-triggered playback, custom white-on-gray theming, and controlless players that respond to page navigation instead of traditional user input.
- [Video.js version 4.3.0 released w/ shiny new API docs](/blog/video-js-version-4-3-0-released-w-shiny-new-api-docs): Video.js 4.3.0 debuts automatically-generated API documentation using Esprima's abstract syntax tree parsing, adds centered big play button option, introduces new loading spinner styles, and showcases growing plugin ecosystem with 26 community contributions.
- [4.2.2 Patch Release](/blog/4-2-2-patch-release): Video.js 4.2.2 fixes two critical bugs including a Firefox race condition during video loading that broke playback and an issue where duration would get stuck at 0:00 when loading the player dynamically.
- [Running Video.js unit tests in real browsers with Karma](/blog/running-video-js-unit-tests-in-real-browsers-with-karma): Video.js integrates Karma testing framework to enable unit test execution in real browsers beyond PhantomJS, with plans to expand support to mobile devices and provide public test result visibility for contributors.
- [Unauthorized modification of Video.js CDN files](/blog/unauthorized-modification-of-video-js-cdn-files): Video.js CDN files were compromised for three hours with malware from the Sendori Auto-update Hack, prompting immediate security fixes including restricted CDN access, third-party monitoring, and defined incident response processes to prevent future attacks.
- [Video.js 4.2.0 released! RTMP, CSS designer, and stability](/blog/video-js-4-2-0-released-rtmp-css-designer-and-stability): Video.js 4.2.0 adds beta RTMP streaming support for Flash, updates the CSS skin designer, implements major control bar improvements, and introduces LESS preprocessing to the default skin for enhanced customization.
- [Hiding and Showing Video Player Controls](/blog/hiding-and-showing-video-player-controls): Video.js introduces a userActive state system to intelligently show and hide player controls across desktop and touch devices, enabling controls to fade out in fullscreen mode and respond properly to mobile gestures without relying on mouse events.
- [New Player Skin Designer for Video.js](/blog/new-player-skin-designer-for-video-js): Brightcove hack week produces an interactive Video.js skin designer that enables real-time CSS customization using LESS preprocessing, demonstrating how HTML/CSS skins work across both HTML5 and Flash playback.
- [Video.js 4.1.0 Released](/blog/video-js-4-1-0-released): Video.js 4.1.0 ships with method queuing for Flash fallback, improved component APIs with fadeIn/fadeOut exports, enhanced user agent detection for Android, and multiple bug fixes for IE and captions.
- [Video.js 4.0 now available!](/blog/video-js-4-0-now-available): Video.js 4.0 delivers an 18% size reduction through Google Closure Compiler, automated cross-browser testing with TravisCI and BrowserStack, a new plugin interface, redesigned font-based icon skin, improved accessibility, and Apache 2.0 licensing.
- [Repo Moved!](/blog/repo-moved): Video.js source code repository moves from github.com/zencoder/video-js to github.com/videojs/video.js in preparation for version 4.0, with existing forks and pull requests remaining intact.
- [Site and Support Updates](/blog/site-and-support-updates): Video.js transitions to full-time development and modernizes its support infrastructure by moving from custom forums to Stack Overflow for questions, GitHub Issues for bug tracking, and Trello for project management transparency.
- [Brightcove Acquires Zencoder](/blog/brightcove-acquires-zencoder): Brightcove acquires Zencoder, ensuring Video.js remains free and open source while gaining full-time dedicated development from creator Steve Heffernan and collaboration with Brightcove's world-class player development team.
- [Version 3.2 Update](/blog/version-3-2-update): Video.js 3.2 debuts a new video tag builder tool, completely overhauls HTML5 track support with WebVTT format compatibility, enables chapter navigation, and makes API methods accessible earlier through call caching before player readiness.
- [Version 3.1 Update](/blog/version-3-1-update): Video.js 3.1 introduces experimental iframe mode for Flash to solve Firefox reload bugs, replaces swfobject with custom embedding to reduce file size, and improves fullscreen support with CSS fixes for Firefox 9.
- [Video.js Version 3.0!](/blog/video-js-version-3-0): Video.js 3.0 launches with a unified HTML/CSS skin for both HTML5 and Flash playback, a lightweight Flash fallback player, and free CDN hosting by Level3 for improved performance and accessibility.
- [Lynda.com HTML5 Video Tutorial Released](/blog/lynda-com-html5-video-tutorial-released): Video.js creator Steve Heffernan announces the release of his comprehensive HTML5 video tutorial series on Lynda.com, offering developers professional training on modern web video implementation.
- [How are you using video.js?](/blog/how-are-you-using-video-js): Video.js creator Steve Heffernan reaches out to the community to discover how developers are implementing the HTML5 video player across different websites and use cases.
- [New MPEG LA WebM/VP8 Patent Pool](/blog/new-mpeg-la-webm-vp8-patent-pool): MPEG LA calls for patents to create a licensing pool around Google's WebM/VP8 codec, potentially threatening the open-source format's royalty-free status and complicating the HTML5 video format landscape.
- [Apple adds AirPlay to Mobile Safari](/blog/apple-adds-airplay-to-mobile-safari): iOS 4.3 beta brings AirPlay streaming to Mobile Safari, allowing HTML5 videos to stream directly from iPhone and iPad to Apple TV by adding a simple x-webkit-airplay attribute to video tags.
- [Google is dropping h.264 from Chrome](/blog/google-is-dropping-h-264-from-chrome): Google announces it will remove H.264 support from Chrome to back open-source video formats, making Chrome the first browser to drop the proprietary codec despite it being widely supported across Apple and Microsoft platforms.
- [Over 50% of web users now support HTML5 Video](/blog/over-50-of-web-users-now-support-html5-video): HTML5 video reaches a turning point as browser support surpasses 50% of web users in early 2011, driven largely by Firefox and Chrome adoption, though the MP4/h.264 vs WebM/VP8 format war continues to complicate widespread adoption.
- [HTML5 Video + Google Maps Mashup](/blog/html5-video-google-maps-mashup): Mozilla showcases creative HTML5 video capabilities with an Indiana Jones-inspired demo that synchronizes video playback with animated route visualization on Google Maps in real-time.
- [2.0.2 Release - Subtitle Optimization + Safari on Leopard FS Fix](/blog/2-0-2-release-subtitle-optimization-safari-on-leopard-fs-fix): Video.js 2.0.2 delivers performance improvements with a completely rewritten subtitle parser, fixes a Safari fullscreen bug on Mac OS X Leopard, and adds volume range validation to prevent playback issues.
- [2.0.0 Release - Behaviors, fallback APIs, and more.](/blog/2-0-0-release-behaviors-fallback-apis-and-more): Video.js 2.0.0 introduces a groundbreaking "behaviors" system for creating custom controls, unified APIs for HTML5 and Flash fallback players, configurable fallback order, and switches from list-based to div-based controls for better style portability.
- [Make sites serve you HTML5 video in Safari](/blog/make-sites-serve-you-html5-video-in-safari): John Gruber demonstrates how to access HTML5 video in Safari by masquerading as Mobile Safari, revealing how many sites unnecessarily require Flash when they already support HTML5 video for iOS devices.
- [1.1.5 Release - Subtitles using track, Android fix & more](/blog/1-1-5-release-subtitles-using-track-android-fix-more): Video.js 1.1.5 introduces HTML5 track element support for WebSRT subtitles, adds a pluggable players system for defining fallback order, fixes Android playback issues, and includes a major code reorganization for better maintainability.
- [Version 1.1.4 Release - CSS Loading Spinner & More](/blog/version-1-1-4-release-css-loading-spinner-more): The most notable update in this version is a loading indicator spinner, for when the video is buffering or seeking.
- [Version 1.1.3 Release](/blog/version-1-1-3-release): Version 1.1.3 introduces a big play button on first load to fix Safari bugs, adds width/height functions for player resizing, and includes improvements to control bar behavior and event handling.
- [Facebook Adds HTML5 Video](/blog/facebook-adds-html5-video): Facebook introduces HTML5 video for iPhone and iPad playback as part of their mobile HTML5 implementation, though Flash still outperforms HTML5 on other mobile browsers at this early stage.
- [iPad & iPhone Video Poster Fix (bonus Javascript Placement Fix)](/blog/ipad-iphone-video-poster-fix-bonus-javascript-placement-fix): Video.js 1.1.2 fixes critical iOS 3 bugs on iPad and iPhone where poster attributes and JavaScript placement broke video playback, using a new approach to programmatically set video sources and trigger loading.
- [VideoJS is IE9 Compatible](/blog/videojs-is-ie9-compatible): Initial testing confirms Video.js is compatible with the Internet Explorer 9 preview, successfully rendering controls and playback despite IE's historical CSS layout challenges.
- [New VideoJS Site (Now with more HTML5)!](/blog/new-videojs-site-now-with-more-html5): Video.js unveils a completely redesigned website built with HTML5 semantic elements and modern CSS techniques, featuring a new blog and Twitter account for project updates and HTML5 video news.