私はVideを使ってビデオをバックグラウンドで再生しています。 再生中のdivタグは次のとおりです。JQueryの背景ビデオがページ全体をカバーしない
<div style="width: 1000px; height: 500px;"
data-vide-bg="path/to/video" data-vide-options="loop: false, muted: false, position: 0% 0%">
</div>
私は
width: 100%; height: 100%;
にスタイルを変更するとビデオがページに表示されなくなります。私はそのビデオがすべてのページをカバーし、私は下にスクロールすることができます。
どうしてですか？
どうすれば修正できますか？
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title>Body background example</title>
<style>
html, body {
margin: 0;
width: 100%;
height: 100%;
}
</style>
</head>
<body data-vide-bg="video/ocean">
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<script>window.jQuery || document.write('<script src="../libs/jquery/dist/jquery.min.js"><\/script>')</script>
<script src="../src/jquery.vide.js"></script>
</body>
</html>
スクロールバーを置くか、スクロール目的でjqueryを使用するだけです。
あなたはdiv要素ですべてをカバーしたいと、画面の大きさに応じて調整する場合、これはコード（重要、これはdiv要素に指令です）です：
style="
position: absolute;
z-index: -1;
top: 0px;
left: 0px;
bottom: 0px;
right: 0px;
overflow: hidden;
-webkit-background-size: cover;
background-size: cover;
background-image: none;
background-position: 50% 50%;
background-repeat: no-repeat no-repeat;"
あなたがしたい場合body内にあるexamples/body-bg.htmlは本文にのみ適用される例です。https://github.com/VodkaBears/Vide/tree/master/examples
測定単位が正しくありません。 CSSイメージの背景を使ってイメージをプルすると、イメージのbackground-sizeをcontainsプロパティに設定できます。ビデオがコンテナ（body、div、spanなど）に完全に収まることを保証します。
body{
background-image:url(''your-video.mp4');
background-repeat:no-repeat;
image-background-size: contain;
}
出典：w3schools CSS3 background-size Property
ます。また、高さと幅を使用してみたが、VHとVWのメトリックを使用することができます。ビューポートの寸法に基づいて高さと幅を設定します。
出典：CSS Units