如何在iPad上显示HTML5视频的海报？

我的HTML5视频语法是几乎相同this guy：如何在iPad上显示HTML5视频的海报？

<video height="270" width="480" 
    src="media/bbb.ogv" 
    poster="media/bbb.jpg" 
    durationHint="0:4:44"> 
</video>

在iPhone（iOS版5.0）和桌面火狐，我可以看到海报：

enter image description here

但在iPad上（iOS版5.0.1）它没有出现。我记得它曾经与iOS在iPad上工作不到5

enter image description here

来源

2012-04-25 JoJo

您是否尝试过使用绝对URL的海报形象？ – j08691 2012-04-27 21:10:55

我设法让我的Safari在iPad上崩溃。当我重新启动时，我检查了所有HTML5示例网站，并且缩略图奇迹般地开始工作。我想知道是否有人可以在iPad上重现黑色缩略图的问题。 – JoJo 2012-04-27 21:20:01

我已经测试了与iOS 5.0的ipad相同的代码位，并且海报图像即将到来 – user850234 2012-05-03 06:40:53

使用绝对的，而不是相对路径尝试相同的代码：

<video height="270" width="480" 
    src="http://cdn.kaltura.org/apis/html5lib/kplayer-examples/media/bbb_trailer_iphone.m4v" 
    poster="http://cdn.kaltura.org/apis/html5lib/kplayer-examples/media/bbb480.jpg" 
    durationHint="00:04:44"> 
</video>

如果不工作，他们的CDN可能会阻止外部引用者，因此请尝试将文件保存到您自己的本地服务器并使用绝对路径。

注意：您不必使用绝对路径，但它绝对有助于排除故障。

如果失败的另一个解决方案是使用绝对定位的图像覆盖图，点击后，使用JavaScript来激活下面的标记;但这是一个老式的黑客攻击，iOS 5+不应该这么做。

的iOS 3肯定有与视频标签的海报属性的已知问题： http://videojs.com/2010/09/ipad-iphone-video-poster-fix-bonus-javascript-placement-fix/

来源

2012-05-04 01:16:40 bcmoney

良好的通话，我有完全相同的问题，这是多年来我听到的。将海报图像移动到没有密码保护的目录中，然后iPad可以读取图像。（不需要改变我的相对路径为绝对路径btw）。感谢bcmoney！ – alsweet 2012-06-04 18:34:37

好点。我在密码保护的临时环境中也遇到了问题。 – ToniTornado 2013-11-13 15:09:53

同样的问题在这里：海报图像不显示，如果我从我自己的分段env服务器加载它，但它会从另一个生产服务器加载它。我试图使用绝对路径，并删除密码保护，但没有帮助。应该有别的东西......也许这个请求的响应时间？ – 2013-12-16 14:32:50

如何在iPad上显示HTML5视频的海报？

回答

相关问题