Question

很简单，我有一个<video>标签如下：

<video id="video" controls preload>
    <source src="media/video.mp4" type="video/mp4">
    <source src="media/video.webm" type="video/webm">
    <source src="media/video.ogv" type="video/ogg">
    Your browser does not support the video tag.
</video>

相当标准。但是，我希望使用内置媒体播放器在移动设备上打开视频，就像在iPhone上观看Safari中的YouTube视频一样。

我怎么能实现这个目标？移动网站是使用jQuery Mobile构建的。

此外，我想我在某处读到从type标记中删除<source>属性会增加兼容性。这是真的吗？

Answer 1

更新：如果您尝试从混合Android应用程序播放视频文件，那么下面的代码应该对您有用。要在Android Native播放器中播放HTML5视频，可以使用一小段Java代码 -

Intent intent = new Intent(android.content.Intent.ACTION_VIEW);
Uri data = Uri.parse(“path of the video file”); //Specify the video file path
intent.setDataAndType(data,“video/mp4″);
startActivity(intent);

现在使用你的JavaScript函数调用上面的Java本机代码，传递上面显示的视频元素或路径，你应该对你的播放器很好。

要回答你的第二个问题，我认为删除类型属性不会增加手机中的视频兼容性，因为它是为本机播放器设置的必须属性，以便知道视频文件的编码。

Answer 2

Video.js与大多数浏览器兼容，但您必须为移动浏览器设置视口等。

This教程可能会帮助你多一点。

Answer 3

您可以尝试使用新兴的HTML5 Fullscreen API来执行此操作。看起来supported in iOS5+ and Android 4.0+

请查看此tutorial或阅读full spec。

我没有听说过删除type属性有什么好处。拿出来可能会导致问题。

在iOS / Android原生媒体播放器中播放HTML5视频

3 个答案: