Question

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />    
</head>

<body>
<video id="my_video_1" class="video-js vjs-default-skin" controls
 preload="auto" width="300" height="170" poster="../images/audi/audi_poster.png"
 data-setup="{}">
 <source src="../videos/audi/audi.mp4" type='video/mp4'>
 <source src="../videos/audi/audi.ogg" type='video/ogg'>
 <source src="../videos/audi/audi.webm" type='video/webm'>

 </video>
 </body>
 </html>

对于上述代码，该文件在Google Chrome上播放时没有任何错误，但在Firefox和IE上没有。

我不知道我哪里错了。请帮助..我真的需要解决这个问题。请帮忙

该网站在goddady服务器上运行。我没有使用任何数据库存储视频文件或任何PHP编程..我只是将视频上传到服务器n的html文件... 它是一个非常简单的页面，我希望在所有3个浏览器中播放视频..

Answer 1

HTML5 video和audio标记支持目前并不是最友好的。

首先，DOCTYPE应该是<!DOCTYPE html>，如评论中所述。然后有几件事要考虑：

Firefox不支持MP4播放，Opera也不支持。您需要将视频从MP4转换为WEBM或OGG格式，并将它们放在与MP4相同的目录中以适合您的示例。
IE8及以下版本根本不支持<video>标记，我猜这是你的IE版本的问题。但IE9确实支持MP4播放。

对于我目前正在进行的项目有一个很好的游戏，我也遇到了一些问题：

iOS设备（以及一般的移动设备）不太喜欢标签（特别是内联），在玩了一段时间之后，我最终直接链接到MP4视频，它现在在默认播放器中打开
Google Chrome或IE9尚不支持全屏按钮，但Safari确实如此。没有检查FF或Opera，见下文。

避免用户上传3个不同的文件。我为FF和Opera（以及任何不支持MP4 <video>播放的浏览器）添加了闪回后备（Flowplayer）。我可以在服务器上创建WEBM或OGG文件，但这也有助于像IE8这样的旧浏览器。以下是关于如何检查对MP4播放的支持的 JavaScript 代码段：

var flashaudioplayer=false;
var flashvideoplayer=false;

// Check if browser supports HTML5 native mp3/mp4 playback
var audioTag = document.createElement('audio');
var videoTag = document.createElement('video');
if (!(!!(audioTag.canPlayType) && ("no" != audioTag.canPlayType("audio/mpeg")) && ("" != audioTag.canPlayType("audio/mpeg")))) {
flashaudioplayer=true;

}
if (!(!!(videoTag.canPlayType) && ("no" != videoTag.canPlayType("video/mp4")) && ("" != videoTag.canPlayType("video/mp4")))) {
flashvideoplayer=true;
}

您还会在<audio>标签中找到与MP3播放支持相同的问题，Flowplayer还有一种播放MP3文件的方法，因此它是闪回后备的不错选择。
< / LI>

mp4文件无法在Firefox和IE上运行

1 个答案: