用video.js和windows自带播放插件MediaPlayer实现视频播放

一个菜鸟的奋斗之路

于 2018-10-25 15:07:47 发布

阅读量2.6k

点赞数

分类专栏： html js

本文链接：https://blog.csdn.net/tao111369/article/details/83378946

版权

本文介绍了一种方法，通过video.js在Chrome和IE10+上播放视频，而在IE9及以下版本则利用Windows自带的MediaPlayer插件。详细讲述了video.js的配置，包括视频路径、播放按钮位置、初始图片设置等，并提供了MediaPlayer的实现方式。同时，给出了通过JS判断浏览器类型以选择播放方式的方案。

摘要由CSDN通过智能技术生成

由于本人在搜索资料没有找到video.js插件支持ie8的方法，所以在做查看视频的功能时想法是这样的，对于谷歌和IE10以上用video.js的方法实现，而IE9及IE8用MediaPlayer实现。下面是实现代码（只测试过mp4格式的）：

1.video.js实现

<html>  
<head>  
  <meta charset="utf-8">  
  <link href="http://vjs.zencdn.net/5.5.3/video-js.css" rel="stylesheet">  
  <!-- If you'd like to support IE8 -->  
  <script src="http://vjs.zencdn.net/ie8/1.1.1/videojs-ie8.min.js"></script> 
  <script src="http://vjs.zencdn.net/5.5.3/video.js"></script> 
  <style type="text/css">
	//暂停时显示播放按钮
	.vjs-paused .vjs-big-play-button,
	.vjs-paused.vjs-has-started .vjs-big-play-button {display: block;}
  </style>
</head>  
<body>    
 <video id="my-video" class="video-js vjs-big-play-centered" contro