などを、私は、フロントページの見出しの下に再生したビデオでウェブサイトを持っているビデオはかなり大きく、私は携帯電話のブラウザから削除するメディアクエリを使用しています表示：ビデオ要素は表示されません。まだバッファリングされますか？
それは私が欲しいと同じように、細かい表示。
しかし、単に表示するように設定すると、none：まだバックグラウンドでバッファリングされますか？だから、電話のユーザーは、全く理由がないため、読み込み時間が遅くなります。そうであれば、どうすればいいですか？
私はこの質問を検索したが、私はリモートから1つしか見つけなかった。しかし、そこには、コードがロードされるかどうかという問題がありました。そして私は余分なHTMLの行を読み込むことで暮らすことができます。だからそれは問題ではない。
安全のために、私が最初にそれでdisplay: noneを持っているビデオコンテナのための一般的なCSSルールを記述し、その後、画面 768px以上（または何のためにメディアクエリ（@media screen and (min-width: 768px) {...}）内のルールを追加しますあなたのブレークポットは）display: blockを含んでいます。
これは、小さな画面に読み込まれないことを確認するモバイル向けのアプローチです。
携帯端末向けのヒントをお寄せいただきありがとうございます。 :-) – Colobri
「display：block」という一般的なCSSルールがあり、その後にモバイルデバイス用のメディアクエリが続くと、ある時間前まで、イメージ/ビデオ*がモバイルデバイスにも読み込まれることになると確信していました同じ要素に対して 'display：none'を返します。しかし、別の質問でこれについていくつかの議論がありました。この場合、コンテンツの読み込みを避ける新しいブラウザバージョンが既に存在するようです。私はこれについて確信が持てません。私が言ったように、安全な側にいるためには、このモバイル優先アプローチを使用してください。この場合、デスクトップコンテンツはモバイルに読み込まれません。 – Johannes
恐ろしい！私はそれが一番安全な方法だと思います、どうもありがとう、私は今からこの方法でやります！ :-) – Colobri
Firefox（51.0.1デスクトップ）がdisplay:noneで画像を読み込んでいるようです。デバイスがモバイルデバイスであるかどうかを検出し、それが真でない場合にのみビデオをロードする方が良いでしょうか？このような
何か：videoHtmlは、あなたのvideo要素である
//only load video if screen width is greater than 768px
if(screen.width > 768){
$('#video-container').html(videoHtml);
}
。
//only load video if screen width is greater than 768px
if(screen.width > 768){
$('#video-container').html(videoHtml);
}
else{
$('#video-container').html(lowResVideoHtml);
}
をしかし、デバイスが画面の幅を見ているよりも、モバイルデバイスがあるかどうかを検出するために、他の多くの、より良い方法があります。
そして、あなたは、必要に応じて、モバイルデバイス上で低解像度のビデオを読み込むことができます。 https://stackoverflow.com/a/3540295/7353781
何が起こるかをブラウザーの開発者ツールを使用してください – j08691
通常、ブラウザーは「display：none;」としてロードされる要素をロードしません。 しかし、j08691があなたに言ったようにチェックしてください。 – MFGSparka
javascriptでダイナミックに再生しないと、そうではありません。 – sTx