iPad上的HTML5视频“黑屏”

Question

我正在建立一个内嵌视频的网​​站。这个网站也需要为iPad用户提供服务，但我现在无法使用ol video标签。我有一个视频在浏览器中可以正常播放，但不幸的是在iPad上播放。

我只是拿着iPad的黑屏，没有任何错误信息可以说。

以下是我的视频代码：

<video id="movie" width="790" height="250" controls >
    <source src="anim/intro.ipad.mp4"  type='video/mp4; codecs="avc1.42E01E, mp4a.40.2"'>
    <source src="anim/intro.webm" type='video/webm; codecs="vp8, vorbis"'>
    <source src="anim/intro.theora.ogv"  type='video/ogg; codecs="theora, vorbis"'>
</video>
<script>
    var v = document.getElementById("movie");
    v.onclick = function() {
        if (v.paused) {
            v.play();
        } else {
            v.pause();
        }
    };
</script>

这些视频都是在关于HTML5视频的教程之后创建的。它们都使用Miro Video转换器上的首选iPad设置进行编码。

只是因为这很重要（我不确定会不会）我正在iPad模拟器上测试视频。

无论我做什么，我都无法播放视频：

Answer 1

您确定编码正确吗？
试试这个来测试一下：

<video src="anim/intro.ipad.mp4" controls>  
      Your browser does not support the video element.  
</video>  

Answer 2

是正确提供特定视频文件的.htaccess文件吗？

  

确保您的服务器使用正确的mime-types。如果mime-type错误，Firefox将不播放Ogg视频。将这些行放在.htaccess文件中，以将正确的mime-types发送到浏览器

AddType video/ogg  .ogv
AddType video/mp4  .mp4
AddType video/webm .webm

参考： Video for Everybody

另外，您是否使用定位修改视频元素？我发现这也创造了这个黑色视频屏幕。