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 相关文章推荐
javascript Onunload与Onbeforeunload使用小结
Dec 31 Javascript
浅析JavaScript声明变量
Dec 21 Javascript
JSP防止网页刷新重复提交数据的几种方法
Nov 19 Javascript
JavaScript微信定位功能实现方法
Nov 29 Javascript
js canvas实现适用于移动端的百分比仪表盘dashboard
Jul 18 Javascript
vue keep-alive请求数据的方法示例
May 16 Javascript
深入浅析AngularJs模版与v-bind
Jul 06 Javascript
Electron + vue 打包桌面操作流程详解
Jun 24 Javascript
中级前端工程师必须要掌握的27个JavaScript 技巧(干货总结)
Sep 23 Javascript
Js实现复选框的全选、全不选反选功能代码实例
Feb 28 Javascript
详解vue中v-on事件监听指令的基本用法
Jul 22 Javascript
echarts饼图各个板块之间的空隙如何实现
Dec 01 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封装函数实现生成随机的字符串验证码
2017/01/24 PHP
alixixi runcode.asp的代码不错的应用
2007/08/08 Javascript
javascript中的undefined 与 null 的区别  补充篇
2010/03/17 Javascript
Android中资源文件(非代码部分)的使用概览
2012/12/18 Javascript
js操作输入框中选择内容兼容IE及其他主流浏览器
2014/04/22 Javascript
JQuery获取与设置HTML元素的内容或文本的实现代码
2014/06/20 Javascript
json属性名为什么要双引号(个人猜测)
2014/07/31 Javascript
让angularjs支持浏览器自动填表
2014/11/10 Javascript
Javascript中的方法和匿名方法实例详解
2015/06/13 Javascript
BootStrap学习系列之Bootstrap Typeahead 组件实现百度下拉效果(续)
2016/07/07 Javascript
BootStrap select2 动态改变值的方法
2017/02/10 Javascript
js实现鼠标拖动功能
2017/03/20 Javascript
基于Jquery Ajax type的4种类型(详解)
2017/08/02 jQuery
JS实现的简单标签点击切换功能示例
2017/09/21 Javascript
jQuery中内容过滤器简单用法示例
2018/03/31 jQuery
angularjs结合html5实现拖拽功能
2018/06/25 Javascript
解决Vue axios post请求,后台获取不到数据的问题方法
2018/08/11 Javascript
webpack3里使用uglifyjs压缩js时打包报错的解决
2018/12/13 Javascript
vue实现路由不变的情况下,刷新页面操作示例
2020/02/02 Javascript
VSCode Vue开发推荐插件和VSCode快捷键(小结)
2020/08/08 Javascript
[02:09]EHOME夺得首届辉夜杯冠军—现场颁奖仪式
2015/12/28 DOTA
[52:03]DOTA2-DPC中国联赛 正赛 Ehome vs iG BO3 第三场 1月31日
2021/03/11 DOTA
对Python中class和instance以及self的用法详解
2019/06/26 Python
PyQt5的相对布局管理的实现
2020/08/07 Python
python+requests接口自动化框架的实现
2020/08/31 Python
pycharm中如何自定义设置通过“ctrl+滚轮”进行放大和缩小实现方法
2020/09/16 Python
国外平面设计第一市场:99designs
2016/10/25 全球购物
有原因的手表:Flex Watches
2019/03/23 全球购物
世界汽车零件:World Car Parts
2019/09/04 全球购物
数据库笔试题
2013/05/09 面试题
大学生最新职业生涯规划书范文
2014/01/12 职场文书
微笑面对生活演讲稿
2014/05/13 职场文书
创新社会管理心得体会
2014/09/12 职场文书
公司离职证明样本
2014/09/13 职场文书
会计求职简历自我评价
2015/03/10 职场文书
银行实习推荐信
2015/03/27 职场文书