12

<video>デザインの一部として (実際のビデオとしてではなく) 機能するいくつかの要素 (ループ アニメーション) を含むサイトを構築しています。これはデスクトップ ブラウザーでは非常にうまく機能しますが、モバイル デバイスでは問題が発生します。
Android または iOS デバイス (つまり、モバイル Webkit) でサイトを表示すると、OS のビデオ プレーヤーの外観が表示され、クリックするとビデオが何らかのポップアップで開きます。次のようにすることで、自動再生の制限を回避できることはわかっています。

window.onload = function() {
    var pElement = document.getElementById("myVideo");
    pElement.load();
    pElement.play();
};

ただし、これにより、別のウィンドウでビデオが再び開きます...

モバイルデバイスでデスクトップのような動作をエミュレート/有効にする可能性を知っている人はいますか? ありがとう！

編集: マークアップは基本的な<video>構文です。ところで:

<video autoplay loop>
    <source src="vid.mp4" type="video/mp4" />
    <source src="vid.ogg" type="video/ogg" />
    <source src="vid.webm" type="video/webm" />
</video>
4

4 に答える 4

11

うーん、Android についてはわかりませんが、iOS デバイスでは複数のビデオ ストリームを同時に実行できません。

複数の同時オーディオまたはビデオ ストリーム

現在、iOS を実行しているすべてのデバイスは、常に 1 つのオーディオまたはビデオ ストリームの再生に制限されています。2 つ以上のビデオ (横に並べる、部分的に重ねる、または完全に重ねる) の再生は、現在 iOS デバイスではサポートされていません。複数の同時オーディオ ストリームの再生もサポートされていません。ただし、オーディオまたはビデオ ソースを動的に変更することはできます。詳細については、「メディア ソースの順次交換」を参照してください。

于 2012-03-19T02:06:37.293 に答える
1

YouTube は ios で mov または mp4 を使用してビデオのネイティブなルック アンド フィールをロードするか、すべての iOS デバイスにインストールされているため、アプリにリンクしてビデオを再生します。

于 2012-03-20T19:30:38.563 に答える
1

いいえ、Android または iOS デバイス (つまり、モバイル Web キット) では、必要に応じてビデオを実行できません。ビデオは、デバイスのデフォルトのビデオ プレーヤーで開きます。

于 2012-03-19T18:23:08.760 に答える
1

なぜwindows.onload自動再生をバイパスする必要があるのですか? preloadタグを none に正しく設定したことを覚えている場合

<video src="vid.mov" preload=”none”&gt;</video>

動作するはずです。

また、Video For Everyoneアプローチを試してみましたか? これにより、電話の OS ではなく Web ページでビデオを再生できるようになるはずです。そうすれば、サポートされているデバイスでも同じ効果が得られると思います。

編集: j08691 の回答に関して、iPhone の代替アプローチは、複数のビデオ再生の問題を回避する、iPhone のサイト用の単純な Web ビューアー アプリを設計することです。

于 2012-03-24T20:33:35.937 に答える