1
0
mirror of https://github.com/videojs/video.js.git synced 2025-01-17 10:46:00 +02:00

Updated docs links

This commit is contained in:
Steve Heffernan 2012-11-14 15:07:47 -08:00
parent c01676d2bb
commit 5a697478f9
4 changed files with 9 additions and 22 deletions

View File

@ -98,7 +98,7 @@ var howLongIsThis = myPlayer.duration();
### buffered() ###
Returns a [TimeRange](http://videojs.com/docs/glossary.html#timerange) object with sections of the video that have been downloaded. If you just want the percent of the video that's been downloaded, use bufferedPercent.
Returns a [TimeRange](glossary.md#timerange) object with sections of the video that have been downloaded. If you just want the percent of the video that's been downloaded, use bufferedPercent.
```js
var bufferedTimeRange = myPlayer.buffered(),

View File

@ -2,23 +2,23 @@
The Video.js documentation is here to help you setup and use the player. These docs can be found and contributed to in the [Video.js library repository](https://github.com/zencoder/video-js/tree/master/docs).
### [Setup](/docs/setup)
### [Setup](setup.md)
Check out the [5 second setup](/#setup) if you're just getting started. The setup documentation gives a deeper view of the additional methods you can use to trigger the player setup.
### [Options](/docs/options/)
### [Options](options.md)
There are a number of options that can be used to change how the player behaves, starting with the HTML5 media options like autoplay and preload, and expanding to Video.JS specific options.
### [API](/docs/api/)
### [API](api.md)
The Video.js API allows you to control the video through javascript or trigger event listeners, whether the video is playing through HTML5, flash, or another playback technology.
### [Skins](/docs/skins/)
### [Skins](skins.md)
You can change the look of the player across playback technologies just by editing a CSS file. The skins documentation gives you a intro to how the HTML and CSS of the default skin is put together.
### [Tech](/docs/tech/)
### [Tech](tech.md)
A 'playback technology' is the term we're using to represent HTML5 video, Flash, and other video plugins, as well as other players like the YouTube player. Basically anything that has a unique API to audio or video. Additional playback technologies can be added relatively easily.
### [Tracks](/docs/tracks/)
### [Tracks](tracks.md)
Text Tracks are used to display subtitles and captions, and add a menu for navigating between chapters in a video.
### [Glossary](/docs/glossary/)
### [Glossary](glossary.md)
Some helpful definitions.

View File

@ -12,22 +12,18 @@ You can download the Video.js source and host it on your own servers, or use the
### CDN Version ###
```html
<link href="http://vjs.zencdn.net/c/video-js.css" rel="stylesheet">
<script src="http://vjs.zencdn.net/c/video.js"></script>
```
### Self Hosted. ###
With the self hosted option you'll also want to update the location of the video-js.swf file.
```html
<link href="http://example.com/path/to/video-js.css" rel="stylesheet">
<script src="http://example.com/path/to/video.js"></script>
<script>
_V_.options.flash.swf = "http://example.com/path/to/video-js.swf"
</script>
```
@ -35,7 +31,7 @@ Step 2: Add an HTML5 video tag to your page.
--------------------------------------------
With Video.js you just use an HTML5 video tag to embed a video. Video.js will then read the tag and make it work in all browsers, not just ones that support HTML5 video. Beyond the basic markup, Video.js needs a few extra pieces.
1. The 'data-setup' Atrribute tells Video.js to automatically set up the video when the page is ready, and read any options (in JSON format) from the attribute (see ['options'](http://videojs.com/docs/options/)). There are other methods for initializing the player, but this is the easiest.
1. The 'data-setup' Atrribute tells Video.js to automatically set up the video when the page is ready, and read any options (in JSON format) from the attribute (see ['options'](options.md)). There are other methods for initializing the player, but this is the easiest.
2. The 'id' Attribute: Should be used and unique for every video on the same page.
@ -46,7 +42,6 @@ With Video.js you just use an HTML5 video tag to embed a video. Video.js will th
Otherwise include/exclude attributes, settings, sources, and tracks exactly as you would for HTML5 video.
```html
<video id="example_video_1" class="video-js vjs-default-skin"
controls preload="auto" width="640" height="264"
poster="http://video-js.zencoder.com/oceans-clip.png"
@ -55,20 +50,16 @@ Otherwise include/exclude attributes, settings, sources, and tracks exactly as y
<source src="http://video-js.zencoder.com/oceans-clip.webm" type='video/webm' />
<source src="http://video-js.zencoder.com/oceans-clip.ogv" type='video/ogg' />
</video>
```
Alternative Setup for Dynamically Loaded HTML
---------------------------------------------
If your web page or application loads the video tag dynamically (ajax, appendChild, etc.), so that it may not exist when the page loads, you'll want to manually set up the player instead of relying on the data-setup attribute. To do this, first remove the data-setup attribute from the tag so there's no confusion around when the player is initialized. Next, run the following javascript some time after the Video.js javascript library has loaded, and after the video tag has been loaded into the DOM.
```js
_V_("example_video_1", {}, function(){
// Player (this) is initialized and ready.
});
```
The first argument in the \_V_ function is the ID of your video tag. Replace it with your own.

View File

@ -8,17 +8,13 @@ You can view the uncompressed CSS for the default skin by downloading the latest
You can either override styles in the default skin:
```css
.vjs-default-skin .vjs-play-progress { background: #900; }
```
Or remove the 'vjs-default-skin' class from the video tag and create your own skin.
```html
<video class="video-js my-custom-skin" ...>
```
More custom skins will be available for download soon. If you have one you'd like to contribute back, please email it to <script type="text/javascript">eval(decodeURIComponent('%64%6f%63%75%6d%65%6e%74%2e%77%72%69%74%65%28%27%3c%61%20%68%72%65%66%3d%22%6d%61%69%6c%74%6f%3a%73%6b%69%6e%73%40%76%69%64%65%6f%6a%73%2e%63%6f%6d%22%3e%73%6b%69%6e%73%40%76%69%64%65%6f%6a%73%2e%63%6f%6d%3c%2f%61%3e%27%29%3b'))</script>.