DWQA Questions分类: 技术问答关于video的IE8兼容性问题
丁 亚琪 管理员 asked 6月 ago
  • 此为video视频的html代码部分

<video id=”my-video” class=”video-js” controls preload=”auto” autobuffer poster=”images/tu1.jpg” data-setup=”{ techOrder:[‘flash’,’html5′]}”>
    <source src=”http://masvod.sdyu.edu.cn/masvod/public/2015/09/14/20150914_14fca8ca0e7_r1_500k.mp4&#8243; type=”video/mp4″ codecs=”avc1.42E01E.40.2″>
    <p class=”vjs-no-js”>
        为浏览本视频,请更新或升级您的浏览器
        <a href=”http://videojs.com/html5-video-support/ ” target=”_blank”>supports HTML5 video</a>
    </p>
</video>
<script type=”text/javascript” src=”http://www.sdyu.edu.cn/images/video.js”></script&gt;
<!– video播放器的逻辑部分,这里直接引用学校官网的js –>

  • 因IE8不支持HTML5,自然也不支持video标签,此处引入js文件得以解决,具体js如下

<link rel=”stylesheet” type=”text/css” href=”http://vjs.zencdn.net/5.19.2/video-js.css”&gt;
<!– 指定video-js视频播放器的样式 –>

<script src=”http://cdn.bootcss.com/jquery/1.8.0/jquery.min.js”></script&gt;
<!– 必须使用1.8及以下的jquery版本使ie8兼容部分js语法 –>

<script src=”http://api.html5media.info/1.1.8/html5media.min.js”></script&gt;
<!– 使ie8支持h5播放 –>

  • 你以为这样就完事了,不,这里还有一个大坑等着你。。。特别注意,此处所做的兼容,在本地是完全看不到效果的,也就是说只有当上传到服务器以后才可以实现IE8的兼容问题。如此,万事大吉。