UNPKG

background-video

Version:

backgroundVideo makes your HTML5 `<video>` behave like the CSS property `background-size: cover`, making it fully responsive and scaling to aspect ratio. backgroundVideo also has parallax options.

34 lines (30 loc) 441 B
main { position: relative; } /* Video wrap */ .bv-video-wrap { width: 100%; height: 100%; display: none; } .bv-video-wrap--ready { display: block; } .bv-video-wrap::before { /* Optional overlay */ content: ''; position: absolute; height: 100%; width: 100%; top: 0; right: 0; left: 0; bottom: 0; background: rgba(0, 0, 0, 0.5); z-index: 10; } /* Video object */ .bv-video { width: 100%; height: 100%; }