HTML5视频,海报img没有在IE中显示 [英] HTML5 video, poster img doesnt show in IE
问题描述
我遇到了一个小问题 - 我的网站上有一个HTML5视频,它可以在FF,Chrome,Safari中正常使用。但是,如果我设置了autoplay =autoplay,它只显示IE中的视频。不知怎的,它没有显示海报img - 你可以在这里看到它, http://test.jsworldmedia.com/按下查看视频。有人知道什么是错的吗?
I've got a small problem - I have a HTML5 video om my site, it works fine in FF, Chrome, Safari. However, it only shows the video in IE if I set autoplay="autoplay". Somehow it doesn't show the poster img - You can see it here, http://test.jsworldmedia.com/ Just press See Video. Anyone know what is wrong?
代码是:
<video id="videoContainer" width="932" height="524" controls="controls" poster="/media/13037/big_buck_bunny_poster.jpg">
<source src="http://test.jsworldmedia.com/media/13010/big_buck_bunny.mp4" type="video/mp4" />
<source src="http://test.jsworldmedia.com/media/13555/big_buck_bunny.ogv" type="video/ogg" />
<source src="http://test.jsworldmedia.com/media/13034/big_buck_bunny.webm" type="video/webm" />
<object id="flash_fallback_1" class="vjs-flash-fallback" width="932" height="524" type="application/x-shockwave-flash" data="http://releases.flowplayer.org/swf/flowplayer-3.2.1.swf">
<param name="movie" value="http://releases.flowplayer.org/swf/flowplayer-3.2.1.swf" />
<param name="allowfullscreen" value="true" />
<param name="flashvars" value="config={'playlist':['http://test.jsworldmedia.com/media/13037/big_buck_bunny_poster.jpg', {'url': 'http://test.jsworldmedia.com/media/13010/big_buck_bunny.mp4','autoPlay':false,'autoBuffering':true}]}" />
<img src="http://test.jsworldmedia.com/media/13037/big_buck_bunny_poster.jpg" width="932" height="542" alt="" title="No video playback capabilities." />
</object>
</video>
推荐答案
如果部分视频是IE9,IE9会覆盖海报图片已加载,这是默认值。如果您添加属性 preload =none
海报图片将在IE9中有效。
IE9 overwrites the poster image if some of the video is loaded, which is the default. If you add the attribute preload="none"
the poster image will work in IE9.
不理想。
edit I've written about this and have also filed a bug report with the W3C as I think that it needs to be changed.
这篇关于HTML5视频,海报img没有在IE中显示的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!