This tutorial will show you in just over 10 minutes how to create a stunning video background on your website.
We’re going to be using the latest techniques and a small JS helper to allow it to work perfectly on internet explorer as well.
When I say the right way, I mean the best possible way so it is supported on most devices.
We will be using: HTML5, CSS, Bootstrap and object-fit-videos.js, accessible here: https://github.com/TricomB2B/object-fit-videos.
It’s highly advisable to use SASS for this for ease of use, but I’ve done it using plain CSS.
An HTML5 Full Screen Video on your website can make a massive impact. It’s an amazing thing if done right. You want to also make sure your Full screen HTML video works on as many devices as possible. Hopefully this tutorial will assist you in learning how to do that!