javascript – 在浏览器中播放HTML5视频 – 什么适用于大多数Android设备?

我正在努力让 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设备上一致运行?

谢谢!

从源声明中删除type属性.这通常会导致Android问题,尤其是旧版本.

您的源声明应该只是:

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

我有一个small site,它在Android上有一个可用的HTML5视频(刚刚在运行Android 2.2的HTC Desire上测试过它).

相关文章
相关标签/搜索