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 submit()无法提交问题
Apr 21 Javascript
javascript属性访问表达式用法分析
Apr 25 Javascript
jQuery.extend 函数及用法详细
Sep 06 Javascript
基于jQuery实现收缩展开功能
Mar 18 Javascript
微信小程序 小程序制作及动画(animation样式)详解
Jan 06 Javascript
js 获取json数组里面数组的长度实例
Oct 31 Javascript
Vue.JS实现垂直方向展开、收缩不定高度模块的JS组件
Jun 19 Javascript
JS实现集合的交集、补集、差集、去重运算示例【ES5与ES6写法】
Feb 18 Javascript
vue element-ui实现input输入框金额数字添加千分位
Dec 29 Javascript
小程序实现多个选项卡切换
Jun 19 Javascript
vue和H5 draggable实现拖拽并替换效果
Jul 29 Javascript
JavaScript实现外溢动态爱心的效果的示例代码
Mar 21 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 empty()与isset()区别的详细介绍
2013/06/17 PHP
解析CodeIgniter自定义配置文件
2013/06/18 PHP
PHP基于GD库的缩略图生成代码(支持jpg,gif,png格式)
2014/06/19 PHP
以文件形式缓存php变量的方法
2015/06/26 PHP
用js实现的检测浏览器和系统的函数
2009/04/09 Javascript
Knockout数组(observable)使用详解示例
2013/11/15 Javascript
js判断日期时间有效性的方法
2015/10/24 Javascript
angularjs创建弹出框实现拖动效果
2020/08/25 Javascript
深入探究JavaScript中for循环的效率问题及相关优化
2016/03/13 Javascript
jQuery实现iframe父窗体和子窗体的相互调用
2016/06/17 Javascript
Node.js Sequelize如何实现数据库的读写分离
2016/10/23 Javascript
使用BootStrap建立响应式网页——通栏轮播图(carousel)
2016/12/21 Javascript
JavaScript实现经典排序算法之选择排序
2016/12/28 Javascript
ionic2打包android时gradle无法下载的解决方法
2017/04/05 Javascript
JavaScript实现数组全排列、去重及求最大值算法示例
2018/07/30 Javascript
微信小程序制作表格的方法
2019/02/14 Javascript
jquery实现简单自动轮播图效果
2020/07/29 jQuery
详解Python中内置的NotImplemented类型的用法
2015/03/31 Python
Python中的两个内置模块介绍
2015/04/05 Python
python 字典(dict)按键和值排序
2016/06/28 Python
详解pyenv下使用python matplotlib模块的问题解决
2018/11/29 Python
使用Django2快速开发Web项目的详细步骤
2019/01/06 Python
Python利用matplotlib做图中图及次坐标轴的实例
2019/07/08 Python
Windows下pycharm创建Django 项目(虚拟环境)过程解析
2019/09/16 Python
python程序中的线程操作 concurrent模块使用详解
2019/09/23 Python
Python Django框架url反向解析实现动态生成对应的url链接示例
2019/10/18 Python
使用python模拟高斯分布例子
2019/12/09 Python
jupyter lab文件导出/下载方式
2020/04/22 Python
香港万宁官方海外旗舰店:香港健与美连锁店
2018/09/27 全球购物
Java平台和其他软件平台有什么不同
2015/06/05 面试题
交通安全演讲稿
2014/01/07 职场文书
一次性工伤赔偿协议书范本
2014/11/25 职场文书
行政处罚决定书
2015/06/24 职场文书
七一晚会主持词
2015/06/29 职场文书
Java 垃圾回收超详细讲解记忆集和卡表
2022/04/08 Java/Android
MySQL transaction事务安全示例讲解
2022/06/21 MySQL