0

このサイトでビデオバックグラウンドプラグインを使用していますhttp://kimcolemanprojects.com/index.html

これはすべてのブラウザでうまく機能しますが、Chromeでのみ、ユーザーが画面をクリックするまでビデオは表示されません。これは単なる白い画面です。

クリックイベントにバインドされているように見えますが、どこにあるのかわかりません。このページにバインドされているイベントは表示されません。

ご協力いただきありがとうございます。

アンジェラ

4

1 に答える 1

0

これは確かに奇妙なものです。私があなたのサイトをバックグラウンドタブで開いたときだけ、それは私のために起こります。クリックハンドラーは絶対にありません。（開発ツールの「イベントリスナーブレークポイント」を参照してください。）そして、ビデオ要素は存在し、表示されていなくてもロードされます。そのため、Chromeのバグか、読み込みの遅い特定のページの処理方法に問題があるのではないかと思います。

それが現れるように見えることの1つは、開発者ツールでCSSを微調整することです。したがって、body要素の最後にあるページにこれを追加してみてください。

<script>
  $(document).ready(function() {
    setTimeout(function() {
      document.getElementsByTagName('video')[0].style.display = '';
    }, 500);
  });
</script>

これは、コンソールで実行すると機能するので、スクリプトで機能することを願っています。

また、ページの読み込みを大幅に高速化し、この特定の問題を軽減するために実行できる簡単な方法がいくつかあります。完全に削除することはできません。

  1. 暗い背景色を設定します。そうすれば、ビデオの読み込みに時間がかかる場合、人々はすぐに白いテキストを見ることができます。

  2. ビデオをはるかに小さくします。約21MBで、背景には大きすぎます。毎秒約3400kbでエンコードされており、これはWeb上のHDビデオでも必要以上です。1000kb以下で試してみてください。多分500kb。また、ビデオファイルにオーディオトラックを含めないでください。

  3. ポスター画像をpngではなくjpgとして保存します。140kbです。あなたはそれをはるかに小さくすることができます。

  4. すべてのスクリプト（モバイルリダイレクトを除く）をbodyタグの下部に配置します。このようにして、スクリプトをロードしなくても、少なくともテキストと背景色を表示できます。

于 2013-03-21T14:54:24.200 に答える