js控制页面的全屏展示和退出全屏显示的方法


Posted in Javascript onMarch 10, 2015

本文实例讲述了js控制页面的全屏展示和退出全屏显示的方法。分享给大家供大家参考。具体实现方法如下:

<!DOCTYPE html>    

<html>    

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />    

<body>    

<div style="margin:0 auto;height:600px;width:700px;">  

<button id="btn">js控制页面的全屏展示和退出全屏显示</button>    

<div id="content" style="margin:0 auto;height:500px;width:700px; background:#ccc;" >  

<h1>js控制页面的全屏展示和退出全屏显示</h1>    

</div>  

</div>    

</body>    

<script language="JavaScript">      

document.getElementById("btn").onclick=function(){     

    var elem = document.getElementById("content");      

    requestFullScreen(elem);     

};     

function requestFullScreen(element) {    

    var requestMethod = element.requestFullScreen || element.webkitRequestFullScreen || element.mozRequestFullScreen || element.msRequestFullScreen;    

    if (requestMethod) {      

        requestMethod.call(element);    

    } else if (typeof window.ActiveXObject !== "undefined") {      

        var wscript = new ActiveXObject("WScript.Shell");    

        if (wscript !== null) {    

            wscript.SendKeys("{F11}");    

        }    

    }    

}    

</script>    

</html>

希望本文所述对大家的javascript程序设计有所帮助。

Javascript 相关文章推荐
JQuery 学习笔记 选择器之四
Jul 23 Javascript
jQuery动态修改超链接地址的方法
Feb 13 Javascript
深入浅出分析javaScript中this用法
May 09 Javascript
异步JavaScript编程中的Promise使用方法
Jul 28 Javascript
jquery-mobile表单的创建方法详解
Nov 23 Javascript
BootstrapTable请求数据时设置超时(timeout)的方法
Jan 22 Javascript
JS实现点击表头表格自动排序(含数字、字符串、日期)
Jan 22 Javascript
基于dataset的使用和图片延时加载的实现方法
Dec 11 Javascript
Vue.js实现的计算器功能完整示例
Jul 11 Javascript
create-react-app使用antd按需加载的样式无效问题的解决
Feb 26 Javascript
微信小程序实现滑动操作代码
Apr 23 Javascript
vue中v-model对select的绑定操作
Aug 31 Javascript
Javascript 正则表达式实现为数字添加千位分隔符
Mar 10 #Javascript
jquery+easeing实现仿flash的载入动画
Mar 10 #Javascript
javascript判断css3动画结束 css3动画结束的回调函数
Mar 10 #Javascript
jQuery实现表格颜色交替显示的方法
Mar 09 #Javascript
jQuery实现个性翻牌效果导航菜单的方法
Mar 09 #Javascript
jQuery实现可用于博客的动态滑动菜单
Mar 09 #Javascript
JQuery操作元素的css样式
Mar 09 #Javascript
You might like
PHP中迭代器的简单实现及Yii框架中的迭代器实现方法示例
2020/04/26 PHP
javascript与CSS复习(二)
2010/06/29 Javascript
JavaScript学习历程和心得小结
2010/08/16 Javascript
关于javascript中this关键字(翻译+自我理解)
2010/10/20 Javascript
jquery ajax同步异步的执行最终解决方案
2013/04/26 Javascript
简单的Jquery遮罩层代码实例
2013/11/14 Javascript
JQuery解析HTML、JSON和XML实例详解
2014/03/29 Javascript
javascript实现验证IP地址等相关信息代码
2015/05/10 Javascript
简单对比分析JavaScript中的apply,call与this的使用
2015/12/04 Javascript
js实现内容显示并使用json传输数据
2016/03/16 Javascript
js如何准确获取当前页面url网址信息
2020/09/13 Javascript
完美解决jQuery fancybox ie 无法显示关闭按钮的问题
2016/11/29 Javascript
Bootstrap源码解读表单(2)
2016/12/22 Javascript
微信小程序开发(二)图片上传+服务端接收详解
2017/01/11 Javascript
微信小程序 数据交互与渲染实例详解
2017/01/21 Javascript
详解如何使用PM2将Node.js的集群变得更加容易
2017/11/15 Javascript
angular2 NgModel模块的具体使用方法
2019/04/10 Javascript
JS将时间秒转换成天小时分钟秒的字符串
2019/07/10 Javascript
layui关闭层级、简单监听的实例
2019/09/06 Javascript
vue 实现强制类型转换 数字类型转为字符串
2019/11/07 Javascript
Vue实现计算器计算效果
2020/08/17 Javascript
[40:06]DOTA2亚洲邀请赛 4.3 突围赛 Liquid vs VGJ.T 第一场
2018/04/04 DOTA
python爬取网站数据保存使用的方法
2013/11/20 Python
Python编程中对文件和存储器的读写示例
2016/01/25 Python
Python实现的爬取网易动态评论操作示例
2018/06/06 Python
谈谈Python中的while循环语句
2019/03/10 Python
Python使用进程Process模块管理资源
2020/03/05 Python
Python通过4种方式实现进程数据通信
2020/03/12 Python
Python MOCK SERVER moco模拟接口测试过程解析
2020/04/13 Python
keras K.function获取某层的输出操作
2020/06/29 Python
Python 忽略文件名编码的方法
2020/08/01 Python
python requests库的使用
2021/01/06 Python
浅析HTML5:'data-'属性的作用
2018/01/23 HTML / CSS
机电系毕业生求职信
2014/07/11 职场文书
六一亲子活动感想
2015/08/07 职场文书
Oracle表空间与权限的深入讲解
2021/11/17 Oracle