17 March 2017 11:15
CSS - the new code - FullScreen HTML5 Video In Pure CSS
by 1 otherTo make the video fullscreen:
video#bgvid {
position: fixed;
top: 50%;
left: 50%;
min-width: 100%;
min-height: 100%;
width: auto;
height: auto;
z-index: -100;
-ms-transform: translateX(-50%) translateY(-50%);
-moz-transform: translateX(-50%) translateY(-50%);
-webkit-transform: translateX(-50%) translateY(-50%);
transform: translateX(-50%) translateY(-50%);
background: url(polina.jpg) no-repeat;
background-size: cover;
}
Conclusion:
“Background” video can be a very powerful feature on a site, but with great power comes great responsibility: please use such features judiciously.
1
(1 marks)