Not a member of Pastebin yet?
Sign Up,
it unlocks many cool features!
- <!-- Basically you just add your video here...before anything content -->
- <div class="fullscreen-bg">
- <video loop muted autoplay class="fullscreen-bg__video">
- <source src="video.mp4" type="video/mp4">
- </video>
- </div>
- <!-- Then you add some CSS and voilá... -->
- <style>
- .fullscreen-bg {
- position: fixed;
- top: 0;
- right: 0;
- bottom: 0;
- left: 0;
- overflow: hidden;
- z-index: -100;
- }
- .fullscreen-bg__video {
- position: absolute;
- top: 0;
- left: 0;
- width: 100%;
- height: 100%;
- }
- @media (min-aspect-ratio: 16/9) {
- .fullscreen-bg__video {
- height: 300%;
- top: -100%;
- }
- }
- @media (max-aspect-ratio: 16/9) {
- .fullscreen-bg__video {
- width: 300%;
- left: -100%;
- }
- }
- @media (max-width: 767px) {
- .fullscreen-bg__video {
- display: none;
- }
- }
- </style>
- <!-- You have a nice video background image then -->
Add Comment
Please, Sign In to add comment