Author: | dvLden |
---|---|
Views Total: | 2,141 views |
Official Page: | Go to website |
Last Update: | August 20, 2018 |
License: | MIT |
Preview:

Description:
Vidage.js a lightweight JavaScript library which allows for HTML5 videos to be used as a background for your webpage.
The plugin also has a fallback that uses a fullscreen background image instead of video to save bandwidth on mobile devices.
How to use it:
Load the Vidage’s JavaScript and Stylesheet as follows:
<link href="Vidage.css" rel="stylesheet"> <script src="Vidage.min.js"></script>
Prepare the fallback image and set the correct path in the Vidage.css.
.Vidage__image{background-image:url(bg.jpg);
Insert HTML5 videos into your webpage’s background.
<div class="Vidage"> <div class="Vidage__image"></div> <video id="VidageVideo" class="Vidage__video" preload="metadata" loop autoplay muted> <source src="1.ogg" type="video/ogg"> <source src="1.mp4" type="video/mp4"> </video> <div class="Vidage__backdrop"></div> </div>
Initialize the Vidage and done.
new Vidage('#VidageVideo');
Changelog:
v0.5.1 (08/20/2018)
- Update