Adding a Background Video to your website is pretty easy with HTML5 Video tag.
<div class="video_container"> <video autoplay loop poster="includes/sample.jpg" id="vid"> <source src="includes/sample.webm" type="video/webm"> <source src="includes/sample.mp4" type="video/mp4"> </video> </div>
This video will autoplay and will be played in a loop. Keep in mind that this is an HTML5 feature, so older browsers won’t support this feature.
To make the video full screen, add the following css:
.video_container { position: relative; bottom: 0%; left: 0%; height: 100%; width: 100%; overflow: hidden; } #vid{ width: 100%; }
Now you have a fullscreen HTML5 Background Video.