javascript iPad 上的 HTML5 视频“黑屏”
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/5077390/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
HTML5 Video "Black Screen" on iPad
提问by Dan Hanly
I'm building a website that has videos embedded within them. This website needs to cater for iPad users as well but I'm having trouble with the ol' videotag at the moment. I have a video that plays fine in browsers but not on an iPad unfortunately.
我正在建立一个网站,其中嵌入了视频。该网站也需要满足 iPad 用户的需求,但我目前在使用 ol'video标签时遇到了问题。我有一个视频可以在浏览器中正常播放,但不幸的是在 iPad 上不能播放。
I'm just getting a black screen with the iPad, and no error message to speak of.
我只是在 iPad 上出现黑屏,而且没有任何错误消息可言。
Here is my code for the video:
这是我的视频代码:
<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>
The videos were all created following tutorials about HTML5 video. They were all encoded using preferred iPad settings on Miro Video converter.
这些视频都是按照有关 HTML5 视频的教程创建的。它们都使用 Miro Video 转换器上的首选 iPad 设置进行编码。
Just incase this matters (I'm not sure it will) I'm testing the video on an iPad simulator.
以防万一这很重要(我不确定会不会)我正在 iPad 模拟器上测试视频。
No matter what I do, I just can't get the video to play:
无论我做什么,我都无法播放视频:


采纳答案by gnur
Are you sure you got the encoding right?
Try this to test it:
你确定你的编码正确吗?
试试这个来测试它:
<video src="anim/intro.ipad.mp4" controls>
Your browser does not support the video element.
</video>
回答by Petrogad
is your .htaccess file serving up the particular video files correctly?
您的 .htaccess 文件是否正确提供了特定的视频文件?
Ensure your server is using the correct mime-types. Firefox will not play the Ogg video if the mime-type is wrong. Place these lines in your .htaccess file to send the correct mime-types to browsers
确保您的服务器使用正确的 MIME 类型。如果 MIME 类型错误,Firefox 将不会播放 Ogg 视频。将这些行放在您的 .htaccess 文件中以将正确的 MIME 类型发送到浏览器
AddType video/ogg .ogv
AddType video/mp4 .mp4
AddType video/webm .webm
Reference: Video for Everybody
参考: 每个人的视频
Also, are you modifying the video element by using positioning? I've found that this creates this black video screen too.
另外,您是否通过使用定位来修改视频元素?我发现这也会产生这个黑色的视频屏幕。

