我有一个小问题-我在我的网站上有一个HTML5视频,它在FF,Chrome,Safari中运行良好。但是,如果我将autoplay=设置为“自动播放”,它只会在IE中显示视频。不知何故,它没有显示海报img -你可以在这里看到它,http://test.jsworldmedia.com/只需按下查看视频。有人知道哪里出问题了吗?
代码是:
<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>发布于 2012-07-14 02:23:31
我发现poster属性太不一致了。对我来说,preload="none"只修复了IE9的问题。
你最好编辑你的视频,使海报图像成为视频的第一帧。
我是这个Video for Everybody站点的铁杆粉丝,它准确地概述了应该如何使用回退来实现html5 <video>标签。作者特别谈到了poster属性,提到了不一致的支持和iOS 3.x中的一个主要错误,作为将海报图像编码到视频的第一帧的原因。
您还可以查看VideoJs,它将处理许多跨浏览器的问题。
EDIT (2012-11-04): VideoJ可能不是一个好的选择,IE 9报告了一些主要问题。
https://stackoverflow.com/questions/8445965
复制相似问题