官网: https://html5media.info/
二.引入script
<script src="//api.html5media.info/1.1.8/html5media.min.js"></script>
二.HTML
1.IE的低版本不支持百分比格式 width="100%",height="100%"
2.使用图片 poster="/images/Course/detail/video_01.jpg"
<a href="javascript:;" class="video_btn"> ???<div class="video_te_sho"> ???????<video src="http://promotion.chimelong.com/gz_chimelong/happy18.mp4" poster="/images/Course/detail/video_01.jpg" width="645" height="430" controls="controls" preload="auto" id="thevideo"></video> ???</div></a>
三.js
function detailPage(){ ???var video = document.getElementById("thevideo"); ???// 判断是否支持vdieo事件 ???if(video.canPlayType){ ???????video.controls = false; ???????// 解决IE8无法使用百分比 ???????$("#thevideo").css({"width":"100%", "height":"100%"}) ???????// 播放暂停 ???????function vidplay(evt){ ???????????if(video.paused){ ???????????????video.play(); ???????????????console.log("暂停"); ???????????}else{ ???????????????video.pause(); ???????????????console.log("播放"); ???????????} ???????} ???????// 点击显示视频 ???????$(".video_btn").on("click", function(){ ???????????if(video.controls === false){ ???????????????video.controls = true; ???????????} ???????????vidplay(); ???????}) ???}}html5media 视频
原文地址：https://www.cnblogs.com/alantao/p/8549057.html