フルページ画像の背景を動画に置き換えます（HTML5）

Question

フルページの画像の背景をビデオで置き換える最も簡単な方法は何ですか？

私は次のHTMLコードを使用します。

<video poster="#.jpg" id="bgvid" playsinline autoplay muted loop> 
    <source src="#.mp4" type="video/mp4"> 
</video> 

次のCSSコード。

video { 
    position: fixed; 
    top: 50%; 
    left: 50%; 
    min-width: 100%; 
    min-height: 100%; 
    width: auto; 
    height: auto; 
    z-index: -100; 
    transform: translateX(-50%) translateY(-50%); 
background: url('#.jpg') no-repeat; 
    background-size: cover; 
    transition: 1s opacity; 
} 

私はHTML5 UPによりスペクトルテンプレートを使用しますが、最も簡単で効率的な方法で、ビデオとバナーの背景を交換する方法を見つけ出すことはできません。それはあなたが何を意味するかだ場合>＃ヘッダー

- （https://html5up.net/spectral）

はCSSで、削除またはヘッダーの背景色を置き換えることができ、ヘッダで

Answer 1

:-)事前にありがとうございました。

-moz-transition: background-color 0.2s ease; 
-webkit-transition: background-color 0.2s ease; 
-ms-transition: background-color 0.2s ease; 
transition: background-color 0.2s ease; 
//background: #2e3842; //delete or change this one 
height: 3em; 
left: 0; 
line-height: 3em; 
position: fixed; 
top: 0; 
width: 100%; 
z-index: 10000;