Folders and files

Name		Name	Last commit message	Last commit date
Latest commit History 4,188 Commits
.github		.github
build		build
docs		docs
lang		lang
sandbox		sandbox
src		src
test		test
.babelrc		.babelrc
.browserslistrc		.browserslistrc
.editorconfig		.editorconfig
.gitignore		.gitignore
.jsdoc.js		.jsdoc.js
.npmignore		.npmignore
.nvmrc		.nvmrc
.remarkignore		.remarkignore
.remarkrc.js		.remarkrc.js
CHANGELOG.md		CHANGELOG.md
CODE_OF_CONDUCT.md		CODE_OF_CONDUCT.md
COLLABORATOR_GUIDE.md		COLLABORATOR_GUIDE.md
CONTRIBUTING.md		CONTRIBUTING.md
LICENSE		LICENSE
README.md		README.md
composer.json		composer.json
index.html		index.html
package-lock.json		package-lock.json
package.json		package.json
postcss.config.js		postcss.config.js
rollup.config.js		rollup.config.js
tsconfig.json		tsconfig.json

Repository files navigation

Video.js - Web Video Player & Framework

Update: Big changes coming in Video.js 10, early 2026!Read the discussion.

Video.js is a full featured, open source video player for all web-based platforms.

Right out of the box, Video.js supports all common media formats used on the web including streaming formats like HLS and DASH. It works on desktops, mobile devices, tablets, and web-based Smart TVs. It can be further extended and customized by a robust ecosystem ofplugins.

Video.js was started in May 2010 and since then:

Millions of websites have used VideoJS over time (sourceBuiltwith)
Billions of end-users every month of just the CDN-hosted copy (source Fastly stats)
900+ amazing contributors to the video.js core
Hundreds ofplugins

Quick Start

Thanks to the awesome folks over atFastly, there's a free, CDN hosted version of Video.js that anyone can use. Add these tags to your document's<head>:

<linkhref="//vjs.zencdn.net/8.23.4/video-js.min.css"rel="stylesheet"><scriptsrc="//vjs.zencdn.net/8.23.4/video.min.js"></script>

Alternatively, you can include Video.js by getting it fromnpm, downloading it fromGitHub releases or by including it viaunpkg or another JavaScript CDN, like CDNjs.

<!-- unpkg : use the latest version of Video.js --><linkhref="https://unpkg.com/video.js/dist/video-js.min.css"rel="stylesheet"><scriptsrc="https://unpkg.com/video.js/dist/video.min.js"></script><!-- unpkg : use a specific version of Video.js (change the version numbers as necessary) --><linkhref="https://unpkg.com/video.js@8.23.4/dist/video-js.min.css"rel="stylesheet"><scriptsrc="https://unpkg.com/video.js@8.23.4/dist/video.min.js"></script><!-- cdnjs : use a specific version of Video.js (change the version numbers as necessary) --><linkhref="https://cdnjs.cloudflare.com/ajax/libs/video.js/8.23.4/video-js.min.css"rel="stylesheet"><scriptsrc="https://cdnjs.cloudflare.com/ajax/libs/video.js/8.23.4/video.min.js"></script>

Next, using Video.js is as simple as creating a<video> element, but with an additionaldata-setup attribute. At a minimum, this attribute must have a value of'{}', but it can include any Video.jsoptions - just make sure it contains valid JSON!

<videoid="my-player"class="video-js"controlspreload="auto"poster="//vjs.zencdn.net/v/oceans.png"data-setup='{}'><sourcesrc="//vjs.zencdn.net/v/oceans.mp4"type="video/mp4"></source><sourcesrc="//vjs.zencdn.net/v/oceans.webm"type="video/webm"></source><sourcesrc="//vjs.zencdn.net/v/oceans.ogv"type="video/ogg"></source><pclass="vjs-no-js">    To view this video please enable JavaScript, and consider upgrading to a    web browser that<ahref="https://videojs.com/html5-video-support/"target="_blank">      supports HTML5 video</a></p></video>

When the page loads, Video.js will find this element and automatically setup a player in its place.

If you don't want to use automatic setup, you can leave off thedata-setup attribute and initialize a<video> element manually using thevideojs function:

varplayer=videojs('my-player');

Thevideojs function also accepts anoptions object and a callback to be invoked when the player is ready:

varoptions={};varplayer=videojs('my-player',options,functiononPlayerReady(){videojs.log('Your player is ready!');// In this context, `this` is the player that was created by Video.js.this.play();// How about an event listener?this.on('ended',function(){videojs.log('Awww...over so soon?!');});});

If you're ready to dive in, theGetting Started page anddocumentation are the best places to go for more information. If you get stuck, head over to ourSlack!

Contributing

Video.js is a free and open source library, and we appreciate any help you're willing to give - whether it's fixing bugs, improving documentation, or suggesting new features. Check out thecontributing guide for more! Contributions and project decisions are overseen by theVideo.js Technical Steering Committee (TSC).

By submitting a pull request, you agree that your contribution is provided under theApache 2.0 License and may be included in future releases. No contributor license agreement (CLA) has ever been required for contributions to Video.js. See theDeveloper's Certificate of Origin 1.1.