About
This jQuery plugin enables you to very easily use an HTML5 video as a background to a website or any div.
For browsers that don't support the HTML5 video tag, it just uses an image.
Warning
Don't abuse this code... Don't use it too often, too many video instances will slow down the browser.
Please bear in mind bandwidth usage for both you, and your visitors
Browser Support
| Video | Image | |
|---|---|---|
| Firefox 4 (the best experience) | Yes (webm) | Yes |
| Internet Explorer 9 | Yes (mp4) | Yes |
| Firefox 3.5 | Yes (ogv) | Yes |
| Chrome | Yes (webm/mp4) | Yes |
| Safari | Yes (mp4) | Yes |
| Opera 10.5+ | Yes (ogv) | Yes |
| Internet Explorer 8 | No | Yes |
| Internet Explorer 7 | No | Yes |
| Android Browser | No | Yes |
| Mobile Safari | Does not modify default behaviour | |
| Older Browsers that support position:fixed | No | Yes |
| Archaic browsers | Does not modify default behaviour | |
Documentation
$(el).videoBG(options);
options
- mp4
- required. this is the src for the video
- ogv
- required. this is the src for the video
- webm
- required. this is the src for the video
- poster
- required. this is the src for the img
- autoplay
bool- loop
intnumber of times to loop, true if infinite- sclae
bool- position
- the css position of the video
- opacity
int0 - 1- textReplacement
bool- used if you are replacing text- zIndex
- optional
- width
- required if textReplacement.
- height
- required if textReplacement.
Donate a beer
You are more than welcome to donate me some beer money :)
I recommend £3 for a donation, just £3!
