js 切换全屏

时间:2023-03-09 13:07:26
js 切换全屏

公司有一个需求就是点击某一个按钮实现全屏切换功能,然后呢我就在网上扒了段代码。封装了一下。使用的小伙伴们可以看看哦!

切换全屏代码

<!DOCTYPE html>
<html> <head>
<meta charset="UTF-8">
<title>切换全屏代码</title>
</head> <body> <input type="button" value="全屏" onclick="Full_switch.fullScreen();" />
<input type="button" value="退出全屏" onclick="Full_switch.exitFullScreen();" />
<script type="text/javascript">
(function(win) {
var switchs = {
fullScreen: function() { //全屏方法
var el = document.documentElement;
var rfs = el.requestFullScreen || el.webkitRequestFullScreen || el.mozRequestFullScreen || el.msRequestFullScreen;
if(typeof rfs != "undefined" && rfs) {
rfs.call(el);
} else if(typeof win.ActiveXObject != "undefined") {
var wscript = new ActiveXObject("WScript.Shell");
if(wscript != null) {
wscript.SendKeys("{F11}");
}
}
},
exitFullScreen: function() { //退出全屏方法
var el = document,
cfs = el.cancelFullScreen || el.webkitCancelFullScreen || el.mozCancelFullScreen || el.exitFullScreen,
wscript; if(typeof cfs != "undefined" && cfs) {
cfs.call(el);
return;
} if(typeof win.ActiveXObject != "undefined") {
wscript = new ActiveXObject("WScript.Shell");
if(wscript != null) {
wscript.SendKeys("{F11}");
}
}
},
}
win.Full_switch =switchs;
})(window);
</script>
</body> </html>

预览地址

点击查看