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 ...
随机推荐
- Linux入门基础（二）——cp、nano命令
- log4j 2 入门实例（2）
本文介绍将日志输出到文件的例子. log4j 2输出到文件 log4j2.xml文件 这个文件里,定义了三个类型的Appender:Console.File和RollingFile. Console类 ...
- re.sub用法
re.sub功能是对于一个输入的字符串,利用正则表达式,来实现字符串替换处理的功能返回处理后的字符串 re.sub共有五个参数 三个必选参数pattern,repl,string 两个可选参数coun ...
- PAT 天梯赛 L2-028. 秀恩爱分得快 【数据处理】
题目链接 https://www.patest.cn/contests/gplt/L2-028 思路 0.只处理被询问的情侣的亲密度,否则会超时 1.要注意输入数字要用字符串,还要标记性别 因为 输出 ...
- 《高性能Javascript》 Summary（一）
第一章.加载和执行 Loading & Execution 原因:Javascript 的执行导致页面渲染中止等待. 解决: 将script放在页面底部,紧靠body 闭合标签之前,保证页面在 ...
- 使用 eslint 和 editorconfig 规范代码
项目中使用eslint 为什么使用eslint : 为了保持代码风格的统一 在做vue项目的时候, 基本上都会使用 vue-cli 脚手架去创建一个vue 项目,里面可以选择使用eslint 代码检测 ...
- 如何用命令行删除EasyBCD开机选择项？
用硬盘安装Ubuntu方法的windows双系统电脑上面,很多人都是用EasyBCD设置的开机启动选择.所以当我们不需要双系统的时候,或者已经删除双系统后,或者安装双系统失败的情况下,发现电脑的开机启 ...
- laravel基础课程---7、文件处理、闪存、cookie（cookie原理和使用场景）
laravel基础课程---7.文件处理.闪存.cookie(cookie原理和使用场景) 一.总结 一句话总结: 页面请求服务器的时候是把这个页面中所有的cookie都带上了的,cookie里面也存 ...
- html5基本格式
html5基本格式 学习要点: HTML5 文档的基本格式 2. 开发工具的基本操作 一． 文档基本格式 <!DOCTYPE html> 文档声明,告诉计算机这是一个HTML5文档. ...
- storm源码剖析（3）：topology启动过程
storm的topology启动过程是执行strom jar topology1.jar MAINCLASS ARG1 ARG2 鉴于前面已经分析了脚本的解析过程,现在重点分析topology1.ja ...