本文主要介绍HTML5视频进入全屏和退出全屏的实现方法。通过示例代码进行了非常详细的介绍，对于大家的学习或者工作都有一定的参考价值。有需要的朋友下面跟边肖学习。
我们在使用视频标签的时候，有时候为了更多的需求，不得不自定义控制条，进入和退出全屏也是其中的一部分。
不同的浏览器有不同的实现方式。
//Webkit
element . webkitrequestfullscreen()；//进入全屏
document . webkitcancelfullscreen()；//退出全屏
//Firefox
element . mozrequestfullscreen()；
document . mozcancelfullscreen()；
//W3C
element . request full screen()；
document . exit full screen()；
一般来说，如果不能兼容不同的浏览器，我们首先使用w3c标准方法。
//进入全屏
函数全屏(){
var ele=document . document element；
if (ele.requestFullscreen) {
ele . request full screen()；
} else if(ele . mozrequestfull screen){
ele . mozrequestfullscreen()；
} else if(ele . webkitrequestfullsscreen){
ele . webkitrequestfullscreen()；
}
}
//退出全屏
函数exitFullscreen() {
var de=文档；
if (de.exitFullscreen) {
de . exit full screen()；
} else if(de . mozcancelfull screen){
de . mozcancelfullscreen()；
} else if(de . webkitcancelfullscreen){
de . webkitcancellscreen()；
}
}
接下来是用例。
$(ele)。on(‘click ‘，function(){
全屏()；
//exit full screen()；
});
关于HTML5视频进入和退出全屏的实现方法这篇文章到此为止。关于HTML5视频进入和退出全屏的更多信息，请搜索脚本之家之前的文章或者继续浏览下面的相关文章。希望大家以后多多支持剧本之家！
来源：剧本之家
链接：https://www.jb51.net/html5/737597.html
