From the course: Creating Web Media

Unlock this course with a free trial

Join today to access over 22,400 courses taught by industry experts.

Fullscreen background video

Fullscreen background video - CSS Tutorial

From the course: Creating Web Media

Fullscreen background video

- [Chris Converse] Hi this is Chris Converse, and in this episode, we'll be adding a fullscreen background video to a webpage. We'll be using some CSS properties to position the video and writing some javascript to detect the video's current time as well as detecting the dimensions of the browser window. This way we can fill the user's window with video or remove the video for devices that don't support this. So if you'd like to follow along with me, download the exercise files and lets begin by opening the html file in a text editor. Now, with the html file open in a text editor, you'll see we have a link up here in the head area to style.css. We'll be working inside of this file in a few moments. Inside the the body area we have an article element and a script tag inside of this script tag we have a comment here. This is where we're going to be adding our javascript. Now if you'd like to preview the layout we're going to be working with, lets go back to the exercise files, lets open…

Contents