5

HTML5 ビデオをモバイル デバイスで再生しようとしています。最新バージョンの iOS では問題なく動作するようですが、Android デバイスとは多くの不一致が発生しています。

私は video.js を使用しており、サムネイル画像のクリックをリッスンしています。これにより、要素が HTML5 ビデオに置き換えられ、自動的に再生されます。次のコードは、Android エミュレーターでは機能しません (サムネイルをクリックしても何も起こりません)。自分の Droid Razr で試してみると、ビデオの読み込みが始まり、ブラウザがフリーズします。これはネイティブ ブラウザとChrome で発生し、デバイス固有のものであることがわかります。

$(".video").live("click", function(e) {
    e.preventDefault();
    $(this).replaceWith("<video id='" + $(this).data("video-id") + "' class='video-js' preoload='auto' width='100%' height='100%' poster='" + $(this).data("video-poster-url") + "'><source type='video/mp4; codecs=\"avc1.42E01E, mp4a.40.2\"' src='" + $(this).data("video-url")  + "'></video>");

    video  = _V_($(this));
    video.ready(function() {
       this.play();
       this.requestFullScreen();
    });
});

HTML は次のようになります。

<video id='fv3530' class='video-js' preoload='auto' width='100%' height='100%' poster='/posters/fv3530.jpg'>
    <source type='video/mp4; codecs="avc1.42E01E, mp4a.40.2" src='/videos/fv3530.mp4'>
</video>

これにより Android デバイスが完全にフリーズする理由と、ほとんどの Android デバイスでビデオを一貫して実行するために何ができるかを知っている人はいますか?

ありがとう！

4

2 に答える 2

2

この質問を参照してください: Android の HTML5 <video> 要素

どうやら、 http://developer.android.com/about/versions/android-2.0-highlights.htmlによると、Android で HTML5 ビデオを使用する可能性があり ますが、これを機能させるためにいくつかの厳密なパラメーターがあります (質問への回答を確認しました）。

あなたの場合、エミュレータ、特にhtml5などでイベントを処理するのは簡単ではないので、テストには常に実際のデバイスを使用する必要があります(本当にお勧めします)。お使いの携帯電話が機能しない理由として考えられるのは、サポートされていないビデオ コーデックを使用している可能性があります。

于 2012-12-10T16:25:28.973 に答える
1

宣言typeから属性を削除します。sourceこれは通常、Android、特に古いバージョンで問題を引き起こします。

ソース宣言は次のようにする必要があります。

<source src='/videos/fv3530.mp4'>

Android で HTML5 ビデオが動作する小さなサイトがあります (Android 2.2 を実行している HTC Desire でテストしたところです)。

于 2012-12-10T16:50:59.693 に答える