web/video.js
1
0
Fork 0
mirror of https://github.com/videojs/video.js.git synced 2026-06-19 22:15:04 +02:00
Code Releases Activity
Files
19ebc0dda52ff6b6a6f7e11a3dc181262cddb804
video.js/README.md
T

136 lines
4.5 KiB
Markdown
Raw Normal View History

docs(guides): Manual Documentation Improvements (#3703)
2016-12-02 14:27:59 -05:00
![Video.js logo][logo]
doc updates + readme quick start
2014-10-17 11:55:53 -07:00
docs(guides): Manual Documentation Improvements (#3703)
2016-12-02 14:27:59 -05:00
# [Video.js - HTML5 Video Player][vjs]
@gkatsev added slack badge to README. closes #3527
2016-08-12 23:39:18 -04:00
docs(guides): Manual Documentation Improvements (#3703)
2016-12-02 14:27:59 -05:00
[![Build Status][travis-icon]][travis-link]
[![Coverage Status][coveralls-icon]][coveralls-link]
[![Slack Status][slack-icon]][slack-link]
@gkatsev updated videojs badges in the README. closes #3134
2016-02-24 01:25:04 -05:00
docs(guides): Manual Documentation Improvements (#3703)
2016-12-02 14:27:59 -05:00
[![NPM][npm-icon]][npm-link]
Version 3.0 BETA
2011-09-30 17:28:43 -07:00
docs(guides): Manual Documentation Improvements (#3703)
2016-12-02 14:27:59 -05:00
> Video.js is a web video player built from the ground up for an HTML5 world. It supports HTML5 and Flash video, as well as YouTube and Vimeo (through [plugins][plugins]). It supports video playback on desktops and mobile devices. This project was started mid 2010, and the player is now used on over ~~50,000~~ ~~100,000~~ ~~200,000~~ [400,000 websites][builtwith].
MAJOR REFACTOR: Restrcutured code into class-based components. Setup and configuring should still work the same, but controls and tech elements are now sub-classes for Component, which builds elements and applies event behaviors.
2011-11-29 11:40:05 -08:00
docs(coc): introduce CODE_OF_CONDUCT.md (#4160)
2017-03-23 16:39:17 -04:00
## Table of Contents
* [Quick Start](#quick-start)
* [Contributing](#contributing)
* [Code of Conduct](#code-of-conduct)
* [License](#license)
docs(guides): Manual Documentation Improvements (#3703)
2016-12-02 14:27:59 -05:00
## Quick Start
Thanks to the awesome folks over at [Fastly][fastly], there's a free, CDN hosted version of Video.js that anyone can use. Add these tags to your document's `<head>`:
doc updates + readme quick start
2014-10-17 11:55:53 -07:00
```html
chore: Fix examples and docs and some links (#4279)
2017-05-11 14:16:12 -07:00
<link href="//vjs.zencdn.net/5.19/video-js.min.css" rel="stylesheet">
<script src="//vjs.zencdn.net/5.19/video.min.js"></script>
doc updates + readme quick start
2014-10-17 11:55:53 -07:00
```
chore: Fix examples and docs and some links (#4279)
2017-05-11 14:16:12 -07:00
> For the latest version of video.js and URLs to use, check out the [Getting Started][getting-started] page on our website.
docs(guides): Manual Documentation Improvements (#3703)
2016-12-02 14:27:59 -05:00
Next, using Video.js is as simple as creating a `<video>` element, but with an additional `data-setup` attribute. At a minimum, this attribute must have a value of `'{}'`, but it can include any Video.js [options][options] - just make sure it contains valid JSON!
doc updates + readme quick start
2014-10-17 11:55:53 -07:00
```html
docs(guides): Manual Documentation Improvements (#3703)
2016-12-02 14:27:59 -05:00
<video
id="my-player"
class="video-js"
controls
preload="auto"
poster="//vjs.zencdn.net/v/oceans.png"
data-setup='{}'>
<source src="//vjs.zencdn.net/v/oceans.mp4" type="video/mp4"></source>
<source src="//vjs.zencdn.net/v/oceans.webm" type="video/webm"></source>
<source src="//vjs.zencdn.net/v/oceans.ogv" type="video/ogg"></source>
doc updates + readme quick start
2014-10-17 11:55:53 -07:00
<p class="vjs-no-js">
docs(guides): Manual Documentation Improvements (#3703)
2016-12-02 14:27:59 -05:00
To view this video please enable JavaScript, and consider upgrading to a
web browser that
<a href="http://videojs.com/html5-video-support/" target="_blank">
supports HTML5 video
</a>
doc updates + readme quick start
2014-10-17 11:55:53 -07:00
</p>
</video>
```
docs(guides): Manual Documentation Improvements (#3703)
2016-12-02 14:27:59 -05:00
When the page loads, Video.js will find this element and automatically setup a player in its place.
doc updates + readme quick start
2014-10-17 11:55:53 -07:00
docs(guides): Manual Documentation Improvements (#3703)
2016-12-02 14:27:59 -05:00
If you don't want to use automatic setup, you can leave off the `data-setup` attribute and initialize a `<video>` element manually using the `videojs` function:
doc updates + readme quick start
2014-10-17 11:55:53 -07:00
docs(guides): Manual Documentation Improvements (#3703)
2016-12-02 14:27:59 -05:00
```js
var player = videojs('my-player');
```
The `videojs` function also accepts an `options` object and a callback to be invoked
when the player is ready:
```js
var options = {};
var player = videojs('my-player', options, function onPlayerReady() {
videojs.log('Your player is ready!');
// In this context, `this` is the player that was created by Video.js.
this.play();
doc updates + readme quick start
2014-10-17 11:55:53 -07:00
// How about an event listener?
this.on('ended', function() {
docs(guides): Manual Documentation Improvements (#3703)
2016-12-02 14:27:59 -05:00
videojs.log('Awww...over so soon?!');
doc updates + readme quick start
2014-10-17 11:55:53 -07:00
});
});
```
docs(guides): Manual Documentation Improvements (#3703)
2016-12-02 14:27:59 -05:00
If you're ready to dive in, the [Getting Started][getting-started] page and [documentation][docs] are the best places to go for more information. If you get stuck, head over to our [Slack channel][slack-link]!
Updated grunt script to add CSS/PNG/SWF files dist. Also did some renaming of files and folders.
2013-01-25 15:22:14 -08:00
normalizing markdown markup, whitespace, spelling
2013-02-25 17:13:58 -05:00
## Contributing
docs(guides): Manual Documentation Improvements (#3703)
2016-12-02 14:27:59 -05:00
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 the [contributing guide][contributing] for more!
added license to readme
2013-04-28 17:35:21 -07:00
docs(guides): Manual Documentation Improvements (#3703)
2016-12-02 14:27:59 -05:00
_Video.js uses [BrowserStack][browserstack] for compatibility testing._
docs(coc): introduce CODE_OF_CONDUCT.md (#4160)
2017-03-23 16:39:17 -04:00
## [Code of Conduct][coc]
Please note that this project is released with a [Contributor Code of Conduct][coc]. By participating in this project you agree to abide by its terms.
docs(guides): Manual Documentation Improvements (#3703)
2016-12-02 14:27:59 -05:00
## [License][license]
Video.js is [licensed][license] under the Apache License, Version 2.0.
[browserstack]: https://browserstack.com
chore(docs): Documentation Linting and TOC generation (#3841)
2016-12-20 16:55:59 -05:00
[builtwith]: https://trends.builtwith.com/media/VideoJS
docs(guides): Manual Documentation Improvements (#3703)
2016-12-02 14:27:59 -05:00
[contributing]: CONTRIBUTING.md
chore(docs): Documentation Linting and TOC generation (#3841)
2016-12-20 16:55:59 -05:00
docs(guides): Manual Documentation Improvements (#3703)
2016-12-02 14:27:59 -05:00
[coveralls-icon]: https://coveralls.io/repos/github/videojs/video.js/badge.svg?branch=master
chore(docs): Documentation Linting and TOC generation (#3841)
2016-12-20 16:55:59 -05:00
docs(guides): Manual Documentation Improvements (#3703)
2016-12-02 14:27:59 -05:00
[coveralls-link]: https://coveralls.io/github/videojs/video.js?branch=master
chore(docs): Documentation Linting and TOC generation (#3841)
2016-12-20 16:55:59 -05:00
docs(guides): Manual Documentation Improvements (#3703)
2016-12-02 14:27:59 -05:00
[docs]: http://docs.videojs.com
chore(docs): Documentation Linting and TOC generation (#3841)
2016-12-20 16:55:59 -05:00
docs(guides): Manual Documentation Improvements (#3703)
2016-12-02 14:27:59 -05:00
[fastly]: http://www.fastly.com/
chore(docs): Documentation Linting and TOC generation (#3841)
2016-12-20 16:55:59 -05:00
docs(guides): Manual Documentation Improvements (#3703)
2016-12-02 14:27:59 -05:00
[getting-started]: http://videojs.com/getting-started/
chore(docs): Documentation Linting and TOC generation (#3841)
2016-12-20 16:55:59 -05:00
docs(guides): Manual Documentation Improvements (#3703)
2016-12-02 14:27:59 -05:00
[license]: LICENSE
chore(docs): Documentation Linting and TOC generation (#3841)
2016-12-20 16:55:59 -05:00
docs(guides): Manual Documentation Improvements (#3703)
2016-12-02 14:27:59 -05:00
[logo]: http://videojs.com/img/logo.png
chore(docs): Documentation Linting and TOC generation (#3841)
2016-12-20 16:55:59 -05:00
docs(guides): Manual Documentation Improvements (#3703)
2016-12-02 14:27:59 -05:00
[npm-icon]: https://nodei.co/npm/video.js.png?downloads=true&downloadRank=true
chore(docs): Documentation Linting and TOC generation (#3841)
2016-12-20 16:55:59 -05:00
docs(guides): Manual Documentation Improvements (#3703)
2016-12-02 14:27:59 -05:00
[npm-link]: https://nodei.co/npm/video.js/
chore(docs): Documentation Linting and TOC generation (#3841)
2016-12-20 16:55:59 -05:00
[options]: docs/guides/options.md
docs(guides): Manual Documentation Improvements (#3703)
2016-12-02 14:27:59 -05:00
[plugins]: http://videojs.com/plugins/
chore(docs): Documentation Linting and TOC generation (#3841)
2016-12-20 16:55:59 -05:00
docs(guides): Manual Documentation Improvements (#3703)
2016-12-02 14:27:59 -05:00
[slack-icon]: http://slack.videojs.com/badge.svg
chore(docs): Documentation Linting and TOC generation (#3841)
2016-12-20 16:55:59 -05:00
docs(guides): Manual Documentation Improvements (#3703)
2016-12-02 14:27:59 -05:00
[slack-link]: http://slack.videojs.com
chore(docs): Documentation Linting and TOC generation (#3841)
2016-12-20 16:55:59 -05:00
docs(guides): Manual Documentation Improvements (#3703)
2016-12-02 14:27:59 -05:00
[travis-icon]: https://travis-ci.org/videojs/video.js.svg?branch=master
chore(docs): Documentation Linting and TOC generation (#3841)
2016-12-20 16:55:59 -05:00
docs(guides): Manual Documentation Improvements (#3703)
2016-12-02 14:27:59 -05:00
[travis-link]: https://travis-ci.org/videojs/video.js
chore(docs): Documentation Linting and TOC generation (#3841)
2016-12-20 16:55:59 -05:00
docs(guides): Manual Documentation Improvements (#3703)
2016-12-02 14:27:59 -05:00
[vjs]: http://videojs.com
docs(coc): introduce CODE_OF_CONDUCT.md (#4160)
2017-03-23 16:39:17 -04:00
[coc]: CODE_OF_CONDUCT.md
Copy Permalink