Javascript实现打开或退出浏览器全屏
废话不多说，直接上代码：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
<title>Document</title>
</head>
<body>
<button id="open">全屏展示</button>
<button id="close">退出全屏</button>
<script type="text/javascript">
var open = document.getElementById('open');
var exit = document.getElementById('close'); function openFullScreen() {
var docElm = document.documentElement;
// W3C
if (docElm.requestFullscreen) {
docElm.requestFullscreen();
}
// FireFox
else if (docElm.mozRequestFullScreen) {
docElm.mozRequestFullScreen();
}
// Chrome等
else if (docElm.webkitRequestFullScreen) {
docElm.webkitRequestFullScreen();
}
// IE11
else if (elem.msRequestFullscreen) {
elem.msRequestFullScreen();
}
} function exitFullScreen() {
if (document.exitFullscreen) {
document.exitFullscreen();
} else if (document.mozCancelFullScreen) {
document.mozCancelFullScreen();
} else if (document.webkitCancelFullScreen) {
document.webkitCancelFullScreen();
} else if (document.msExitFullscreen) {
document.msExitFullscreen();
}
}
open.addEventListener('click', openFullScreen, false);
exit.addEventListener('click', exitFullScreen, false);
</script>
</body>
</html>
Javascript实现打开或退出浏览器全屏的更多相关文章
- [JavaScript] 用html5 js实现浏览器全屏
项目中需要将后台浏览器的窗口全屏,也就是我们点击一个按钮要实现按F11全屏的 效果. 在HTML5中,W3C制定了关于全屏的API,就可以实现全屏幕的效果,也可以 让页面中的图片,视频等全屏目前只有g ...
- JavaScript：让浏览器全屏显示
并不是所有人都会按F11让浏览器全屏显示~~~ 一.直接上代码 <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xh ...
- js 实现各浏览器全屏
现代浏览器包括ie11,可以直接用h5的全屏api实现 低版本的IE需要通过ActiveX插件实现: 代码实现 <!DOCTYPE html> <html> <head& ...
- Egret--设置全屏，控制浏览器全屏
1, 手机浏览器打开的项目的时候,浏览器的虚拟按键/标题栏, 使得即便设置全屏也没有变成全屏(好像JS 中有方法向浏览器请求全屏) 2, 加载资源, 关闭后卸载, 再次进入游戏依然很快.不过登陆游戏的 ...
- jsp实现浏览器全屏
在web系统中实现按钮控制浏览器全屏. <!DOCTYPE html> <%@ page contentType="text/html;charset=UTF-8" ...
- 用html5 js实现浏览器全屏
项目中需要将后台浏览器的窗口全屏,也就是我们点击一个按钮要实现按F11全屏的效果. 在HTML5中,W3C制定了关于全屏的API,就可以实现全屏幕的效果,也可以让页面中的图片,视频等全屏目前只有goo ...
- 兼容IE浏览器的js浏览器全屏代码
众所周知,IE是个奇葩的浏览器,但是由于用户量很大,开发者还是不得不为IE考虑一下,于是,各种浏览器相关的操作,都要多一个特别的判断——专门针对IE浏览器的判断,这里的全屏也不例外.看代码: func ...
- 浏览器全屏之requestFullScreen全屏与F11全屏
一.简介 浏览器全屏有两种方式,一种是HTML5新增的requestFullscree全屏,另一种是摁F11实现的全屏,本文将详解两种全屏的特点以及实现代码. 二.requestFullscreen全 ...
- html5 js实现浏览器全屏
全屏 var docElm = document.documentElement; //W3C if (docElm.requestFullscreen) { docElm.requestFullsc ...
随机推荐
- Nginx报出504 Gateway Timeout错误2
昨天,一个程序需要导出500条数据,结果发现到150条是,Nginx报出504 Gateway Timeout错误 经观察,发现大约30秒时超时,php.ini中执行时间配置已经是300秒: 复制代码 ...
- MySql索引建立规则
为了使索引的使用效率更高,在创建索引时,必须考虑在哪些字段上创建索引和创建什么类型的索引.本小节将向读者介绍一些索引的设计原则. 1．选择唯一性索引 唯一性索引的值是唯一的,可以更快速的通过该索引来确 ...
- -es6的部分语法
es6的语法 一 . let 和 var 的区别 : 1 . let 和 val 的区别 : ES6新增了let命令 , 用来声明变量,它的用法类似于 var (ES5), 但是所声明的变量,只在l ...
- iOS开发中集成Reveal
[转]http://blog.devzeng.com/blog/ios-reveal-integrating.html 配置方式一简介有效. Reveal 是一个界面调试工具.使用Reveal,我们可 ...
- WPF区时浏览小程序
在深圳已经工作了一个月了,之前做WinForm的,现在做WPF,每天加班到晚上10点,比之前累.学习新技术也是有个过程的,我就从基础的语法和 界面布局做起.这是我仿着做一个小软件. 效果图赏析 在原基 ...
- HTML5模拟衣服撕扯效果
在线演示 本地下载
- Android Studio第一次启动失败的解决办法
Android Studio Android 开发环境 由于GFW的问题,安装后第一次启动会在显示Fetching android sdk component information对话框后,提示错误 ...
- 关于connect: network is unreachable 问题的解决【转】
本文转载自:https://blog.csdn.net/liukun321/article/details/6662950 由于发现原创文章,在未署名作者及出处的情况下被转载.在以后所有的原创文章开头 ...
- 主成分分析（PCA）与SVD奇异值分解
主要参考:https://www.zhihu.com/question/38417101/answer/94338598 http://blog.jobbole.com/88208/ 先说下PCA ...
- Linux- 恢复.swp文件
当我们对Linux文件系统下的文件编辑时,很多新手老手都有可能出现一些失误,在对一个文件编辑或者改动,甚至是不小心按到键盘并没有发现改动到某处时,没有强制退出(:q!)就直接退出,导致文件变成了.sw ...