video视频标签一些设置，包括封面、播放结束后的封面、视频占满屏幕的方式、视频播放暂停、展示控制栏、触发全屏播放事件

video视频标签一些设置，包括封面、播放结束后的封面、视频占满屏幕的方式、视频链接、视频播放暂停、展示控制栏、触发全屏播放事件 <video autoplay="autoplay" muted=\'muted\' controls="controls" poster="../../img/newIndexImages/images/indexifrstpost.png"> <source src="http://www.likecs.com/img/resource/2019/ptxd/lbdjzz.mp4" type="video/mp4"> </video>

代码如上，poster属性用于设置视频封面；视频链接放在source标签内的src属性；加controls属性就会展示控制栏，不加不显示；

视频占满屏幕的方式 height：100%； width：100%； object-fit:cover；

以下为object-fit属性，可以都尝试下效果看看哪种是你比较喜欢的铺满效果（值得注意的是IE浏览器不兼容此属性）
object-fit关键属性：
object-fit：fill
被替换的内容大小可以填充元素的内容框。 整个对象将完全填充此框。 如果对象的高宽比不匹配其框的宽高比，那么该对象将被拉伸以适应（会变形）。
object-fit:container
被替换的内容将被缩放，以在填充元素的内容框时保持其宽高比。 整个对象在填充盒子的同时保留其长宽比，因此如果宽高比与框的宽高比不匹配，该对象将被添加“黑边”。
object-fit:cover
被替换的内容大小保持其宽高比，同时填充元素的整个内容框。 如果对象的宽高比与盒子的宽高比不匹配，该对象将被剪裁以适应。
object-fit:none
被替换的内容尺寸不会被改变。
object-fit:scale-down
内容的尺寸就像是指定了none或contain，取决于哪一个将导致更小的对象尺寸。

视频进入网页自动播放

查阅资料都是说在vedio属性中加 autoplay="autoplay" muted=\'muted\'，如第一段代码，但是我试了都是被浏览器评屏蔽掉的（为了提高用户体验，浏览器不允许自动播放事件，除非用户自己做了点击播放事件），
在强制刷新时，才会自动播放，网页刚进入并不会播放，我也尝试了triggle事件去自动触发点击事件也不行，以下是能够成功自动播放的代码

var myVideo=document.getElementById("video"); myVideo.muted=true myVideo.play();

在js里面定义muted，然后触发play()

播放结束后的封面

没有找到好的办法，最后还是写了一个假的，就是视频播放完了，在视频上面盖一个图片挡住视频，播放时隐藏，播放完展示

myVideo.onended = function() { $(".endimg").show() }; 视频播放暂停 $(".start").click(function(){ var myVideo=document.getElementById("video"); if (myVideo.paused) { myVideo.play(); }else { myVideo.pause(); } }) 视频触发全屏 function launchFullscreen(element){ //此方法不可以在異步任務中執行，否則火狐無法全屏 　　if(element.requestFullscreen) {//浏览器兼容 　　　　element.requestFullscreen(); 　　} else if(element.mozRequestFullScreen) { 　　　　element.mozRequestFullScreen(); 　　} else if(element.msRequestFullscreen){ 　　　　element.msRequestFullscreen(); 　　} else if(element.oRequestFullscreen){ 　　　　element.oRequestFullscreen(); 　　} else if(element.webkitRequestFullscreen){ 　　　　element.webkitRequestFullScreen(); 　　}else{ 　　　　var docHtml = document.documentElement; 　　　　var docBody = document.body; 　　　　var videobox = document.getElementById(\'video\'); 　　　　var cssText = \'width:100%;height:100%;overflow:hidden;\'; 　　　　docHtml.style.cssText = cssText; 　　　　docBody.style.cssText = cssText; 　　　　videobox.style.cssText = cssText+\';\'+\'margin:0px;padding:0px;\'; 　　　　document.IsFullScreen = true; 　　} } //应用 var myVideo=document.getElementById("video"); launchFullscreen(myVideo);