Video.js Background

Full background video for video.js

Getting Started

Once you've added the plugin script to your page, you can use it with any video:

``html




`

There's also a working example of the plugin you can check out if you're having trouble.

Documentation

$3

You may pass in an options object to the plugin upon initialization. This
object may contain any of the following properties:

#### container
Type: String
Default: 'body'

This specifies the target element for your background video. It defualts to the body for a full background video.

#### autoPlay
Type: Boolean
Default: true

This auto-plays the background video. If this is set to false you have to manually trigger the video start.

#### volume
Type: Double
Default: 0

This sets the default volume level. The range is 0 - 1.

#### mediaAspect
Type: Double
Default: 16 / 9 (1.777777778)

This sets the default video aspect ratio. If using HTML5 media type this will be retrieved automatically.


#### mediaType
Type: String
Default: 'html5'

If you are using a custom media type; such as 'youtube'. You will need to set this so the video can be targetted correctly.

$3

On some mobile devices (such as iOS), auto playing videos is not allowed. In the event of this the videos 'poster' will be displayed as the full background.

$3

You can simply take the JS from /lib/videojs-background.js and use as per the exmaple.html. Alternatively, you can use the below package managers;

#### Bower
bower install videojs-background`

Release History

- 1.0.0: Production ready
- 0.1.0: Initial release

Credits

- Matthew Harrison-Jones: @matt_hojo
- A massive hat tip goes to BigVideo.js for some of the algorithms for calculating fullscreen.