JavaScript实现浏览器全屏功能
作者:流萤时间:2026-10-29 07:49:04浏览:570
本文介绍如何使用JavaScript调用浏览器原生全屏API实现网页全屏显示。代码兼容主流现代浏览器,并针对旧版IE浏览器提供了通过ActiveXObject调用F11键的备用方案,确保在不同环境下均能触发全屏模式。
JavaScript实现浏览器全屏功能
实现该功能的逻辑清晰,代码结构简洁,此处不再赘述。
function fullScreen() {
var el = document.documentElement,
rfs = el.requestFullScreen || el.webkitRequestFullScreen || el.mozRequestFullScreen || el.msRequestFullScreen,
wscript;
if(typeof rfs != "undefined" && rfs) {
rfs.call(el);
return;
}
if(typeof window.ActiveXObject != "undefined") {
wscript = new ActiveXObject("WScript.Shell");
if(wscript) {
wscript.SendKeys("{F11}");
}
}
}
function exitFullScreen() {
var el = document,
cfs = el.cancelFullScreen || el.webkitCancelFullScreen || el.mozCancelFullScreen || el.exitFullScreen,
wscript;
if (typeof cfs != "undefined" && cfs) {
cfs.call(el);
return;
}
if (typeof window.ActiveXObject != "undefined") {
wscript = new ActiveXObject("WScript.Shell");
if (wscript != null) {
wscript.SendKeys("{F11}");
}
}
}
以上就是本文的全部内容,希望对大家有所帮助。
作者最新文章
怎么在 Vue 或 React 项目中正确集成 animate.js
2026-11-05 10:23:38
JS注册事件:addEventListener基础语法与参数详解
2026-11-05 08:44:56
JSP和JS的区别:运行环境与服务端/客户端职责解析
2026-11-04 23:34:36
pdf.js 官方下载地址:GitHub Release 获取预编译包
2026-11-04 23:07:27
前端学习路径:为什么建议先掌握HTML再学习JavaScript?
2026-11-04 18:56:08
