FULL SCREEN BACKGROUND VIDEO
|
Life is just a situation Life is just a game Life is just a whirlpool And it's calling out her name |
Amber were the autumn leaves And amber was her skin Amber was the evening When the whirlpool pulled her in |
It was irresistible Was what she used to say Like the sound of running horses Early in the day |
How to add a full screen background video to a web page
1) Do the obvious and set your video to cover the whole screen, something like this:
#myVideo {
position: fixed;
right: 0;
bottom: 0;
min-width: 100%;
min-height: 100%;
}
2) Do the not so obvious and place a transparent layer (I used rgba but opacity is fine too) over the video and place your content within this layer something like this:
.content {
position: absolute;
bottom: 0;
background: rgba(0, 0, 0, 0);
width: 100%;
height: 100%;
}