js模拟F11页面全屏显示


Posted in Javascript onSeptember 17, 2019

本文实例为大家分享了js模拟F11页面全屏显示的具体代码,供大家参考,具体内容如下

<!DOCTYPE html>
<html lang="en">
<head>
 <meta charset="UTF-8">
 <title>测试全屏</title>
</head>
<body>
 <button id='btn'>全屏按钮</button> 
<div id="content" style="background:yellow;width:500px;height:500px;">
<div id="quite" class="btn">退出全屏</div> 
</div>
 <script type="text/javascript">

var btn = document.getElementById('btn'); 
  var content = document.getElementById('content'); 
  btn.onclick = function(){ 
   console.log(content);
fullScreen(content); 
  }
  var quite = document.getElementById('quite'); 
  quite.onclick = function(){
   exitFullScreen(); 
  }

function fullScreen(el) {
var 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(el) {
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}"); 
}
}
}
 </script>
</body>
</html>

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
URI、URL和URN之间的区别与联系
Dec 20 Javascript
JavaScript 监听textarea中按键事件
Oct 08 Javascript
extJs 文本框后面加上说明文字+下拉列表选中值后触发事件
Nov 27 Javascript
js中判断数字\字母\中文的正则表达式 (实例)
Jun 29 Javascript
常见的jQuery选择器汇总
Nov 24 Javascript
jQuery将表单序列化成一个Object对象的实例
Nov 29 Javascript
Bootstrap Table 搜索框和查询功能
Nov 30 Javascript
vue-cli3.0 脚手架搭建项目的过程详解
Oct 19 Javascript
JS实现盒子跟着鼠标移动及键盘方向键控制盒子移动效果示例
Jan 29 Javascript
基于JS实现计算24点算法代码实例解析
Jul 23 Javascript
JS可断点续传文件上传实现代码解析
Jul 30 Javascript
element-ui中dialog弹窗关闭按钮失效的解决
Sep 22 Javascript
js全屏事件fullscreenchange 实现全屏、退出全屏操作
Sep 17 #Javascript
详解BootStrap表单验证中重置BootStrap-select验证提示不清除的坑
Sep 17 #Javascript
Cordova(ionic)项目实现双击返回键退出应用
Sep 17 #Javascript
如何使用proxy实现一个简单完整的MVVM库的示例代码
Sep 17 #Javascript
ionic+html5+API实现双击返回键退出应用
Sep 17 #Javascript
Vue的属性、方法、生命周期实例代码详解
Sep 17 #Javascript
小程序的上传文件接口的注意要点解析
Sep 17 #Javascript
You might like
一步一步学习PHP(2)――PHP类型
2010/02/15 PHP
curl实现站外采集的方法和技巧
2014/01/31 PHP
ThinkPHP基本的增删查改操作实例教程
2014/08/22 PHP
JavaScript入门学习书籍推荐
2008/06/12 Javascript
JavaScript之编码规范 推荐
2012/05/23 Javascript
js简单实现删除记录时的提示效果
2013/12/05 Javascript
JS数组的赋值介绍
2014/03/10 Javascript
javascript 事件处理示例分享
2014/12/31 Javascript
Javascript对象字面量的理解
2016/06/22 Javascript
js利用appendChild对标签进行排序的实现方法
2016/10/16 Javascript
jquery结合html实现中英文页面切换
2016/11/29 Javascript
jQuery zTree树插件简单使用教程
2017/01/10 Javascript
移动端效果之IndexList详解
2017/10/20 Javascript
使用Vue完成一个简单的todolist的方法
2017/12/01 Javascript
Vue-input框checkbox强制刷新问题
2019/04/18 Javascript
node命令行工具之实现项目工程自动初始化的标准流程
2019/08/12 Javascript
基于jQuery拖拽事件的封装
2020/11/29 jQuery
[03:52]显微镜下的DOTA2第三期——英雄在无聊的时候干什么
2014/06/20 DOTA
使用PyCharm配合部署Python的Django框架的配置纪实
2015/11/19 Python
python中的tcp示例详解
2018/12/09 Python
python 判断字符串中是否含有汉字或非汉字的实例
2019/07/15 Python
Python 实现数据结构-循环队列的操作方法
2019/07/17 Python
python config文件的读写操作示例
2019/09/27 Python
python小程序基于Jupyter实现天气查询的方法
2020/03/27 Python
python爬虫可以爬什么
2020/06/16 Python
Python爬虫自动化获取华图和粉笔网站的错题(推荐)
2021/01/08 Python
英国最大的百货公司:Harrods
2016/08/18 全球购物
Nordgreen美国官网:在线购买极简主义斯堪的纳维亚手表
2019/07/24 全球购物
戴尔马来西亚官网:Dell Malaysia
2020/05/02 全球购物
银行财务部实习生的自我鉴定
2013/11/27 职场文书
学习十八大报告感言
2014/02/04 职场文书
服装促销活动方案
2014/02/23 职场文书
《伯牙绝弦》教学反思
2016/02/16 职场文书
2016优秀员工先进事迹材料
2016/02/25 职场文书
PHP RabbitMQ消息列队
2022/05/11 PHP
一次SQL查询优化原理分析(900W+数据从17s到300ms)
2022/06/10 SQL Server