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 相关文章推荐
不用MOUSEMOVE也能滑动啊
May 23 Javascript
js实现双向链表互联网机顶盒实战应用实现
Oct 28 Javascript
js实现顶部可折叠的菜单工具栏效果实例
May 09 Javascript
jquery衣服颜色选取插件效果代码分享
Aug 28 Javascript
jquery事件的ready()方法使用详解
Nov 11 Javascript
JS中正则表达式只有3种匹配模式(没有单行模式)详解
Jul 28 Javascript
JS简单实现禁止访问某个页面的方法
Sep 13 Javascript
node.js 发布订阅模式的实例
Sep 10 Javascript
浅谈Vue.js中ref ($refs)用法举例总结
Dec 19 Javascript
微信JSSDK实现打开摄像头拍照再将相片保存到服务器
Nov 15 Javascript
JS脚本实现定时到网站上签到/签退功能
Apr 22 Javascript
解决vue项目axios每次请求session不一致的问题
Oct 24 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
农民C键的运用技巧
2020/03/04 星际争霸
ThinkPHP的I方法使用详解
2014/06/18 PHP
php中cookie实现二级域名可访问操作的方法
2014/11/11 PHP
php 在线导入mysql大数据程序
2015/06/11 PHP
thinkPHP中钩子的使用方法实例分析
2017/11/16 PHP
yii 框架实现按天,月,年,自定义时间段统计数据的方法分析
2020/04/04 PHP
Thinkphp 框架扩展之类库扩展操作详解
2020/04/23 PHP
基于JQuery的密码强度验证代码
2010/03/01 Javascript
jQuery判断元素是否是隐藏的代码
2011/04/24 Javascript
js中复制行和删除行的操作实例
2013/06/25 Javascript
JavaScript获取当前日期是星期几的方法
2015/04/06 Javascript
Bootstrap Paginator分页插件与ajax相结合实现动态无刷新分页效果
2016/05/27 Javascript
javascript基于原型链的继承及call和apply函数用法分析
2016/12/15 Javascript
详解nodejs 文本操作模块-fs模块(一)
2016/12/22 NodeJs
深入理解angular2启动项目步骤
2017/07/15 Javascript
nodejs中实现用户注册路由功能
2019/05/20 NodeJs
jQuery zTree树插件的使用教程
2019/08/16 jQuery
小程序角标的添加及绑定购物车数量进行实时更新的实现代码
2020/12/07 Javascript
[07:54]DOTA2 MV《我的动力鞋》 ImbaTV 出品
2014/11/21 DOTA
[38:32]DOTA2上海特级锦标赛A组资格赛#2 Secret VS EHOME第二局
2016/02/26 DOTA
Python3基础之基本数据类型概述
2014/08/13 Python
Python中shutil模块的常用文件操作函数用法示例
2016/07/05 Python
Python打印“菱形”星号代码方法
2018/02/05 Python
Python中的单继承与多继承实例分析
2018/05/10 Python
对python以16进制打印字节数组的方法详解
2019/01/24 Python
python解析xml文件方式(解析、更新、写入)
2020/03/05 Python
python中的socket实现ftp客户端和服务器收发文件及md5加密文件
2020/04/01 Python
open_basedir restriction in effect. 原因与解决方法
2021/03/14 PHP
如何使用localstorage代替cookie实现跨域共享数据问题
2018/04/18 HTML / CSS
印度婴儿用品在线商店:Firstcry.com
2016/12/05 全球购物
德国隐形眼镜店:LuckyLens
2018/07/29 全球购物
Camille Jewelry官网:现代女性时尚首饰
2019/07/07 全球购物
美国在线购买空气净化器、除湿器、加湿器网站:AllergyBuyersClub
2021/03/16 全球购物
运动会解说词50字
2014/01/18 职场文书
礼仪培训心得体会
2016/01/22 职场文书
使用Python开发贪吃蛇游戏 SnakeGame
2022/04/30 Python