Download
User Rating: 0.7/5 ( 1 votes)
CoverVid is a jquery plugin that make your HTML5 video behave like a background cover image with a simple jQuery extension. Very simple to use.
Source: github.com
1. INCLUDE JS FILES
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script src="covervid.min.js"></script>
2. HTML
<div class="covervid-wrapper">
<video class="covervid-video" autoplay loop poster="img/video-fallback.png">
<source src="videos/clouds.webm" type="video/webm">
<source src="videos/clouds.mp4" type="video/mp4">
</video>
</div>
3. CSS
.covervid-wrapper {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
4. JAVASCRIPT
$('.covervid-video').coverVid(1920, 1080);
we simply call the coverVid() function on the video element, passing through the native dimensions of the video.