2

Android (Chrome for Android) で HTML5 ビデオとキャンバスに問題があります。ビデオからキャンバスにフレームを描画します (CanvasRenderingContext2D.drawImage() を使用)。デスクトップ ブラウザでは問題なく動作しますが、Chrome for Android では動作しません。Chrome for Android では、ビデオ要素が表示されている場合にのみ機能します。つまり、要素がプロパティで表示されていても、ページのスクロールのために表示されていない場合でも、機能しません。

この例http://html5demos.com/video-canvasは、モバイル デバイスのビューポートに少なくとも 1 ピクセルのビデオ要素が表示されている場合にのみ機能します。動画要素が完全に非表示の場合 - キャンバスは更新されません。

だから、私は回避策を探しています。ビデオ要素が非表示のときにキャンバスを更新するにはどうすればよいですか?

4

2 に答える 2

0

動画要素に次の CSS スタイルを設定してみてください。

position: fixed;
top: 0;
left: 0;
opacity: 0;

そうすれば、スクロールに関係なく、常にページに「表示」され、スペースを占有することはありませんが、表示されません。

これはバグ、または少なくとも非標準の動作のように聞こえるため、不透明度を 0 に設定しても機能しない場合があります。不透明度を 0.05 などの非常に低い値に設定してみてください。これは、特に 1x1 ピクセルのみの場合はそれほど悪くないかもしれません。

于 2014-02-19T14:17:39.023 に答える