javascript全屏操作
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<style type="text/css">
html,
body {
padding: 0;
margin: 0;
width: 100%;
height: 100%;
background: green;
}
</style>
</head>
<body>
<button id="btn">button</button>
<p id="">这是一个段落</p>
<script type="text/javascript">
var btn = document.querySelector('#btn');
btn.addEventListener('click', function(e) {
if (document.body.RequestFullscreen) {
document.body.RequestFullscreen();
} else if (document.body.webkitRequestFullscreen) {
document.body.webkitRequestFullscreen();
} else {
console.log('不支持')
}
// e.preventDefault()
})
</script>
</body>
</html>
点击按钮将会全屏，esc退出全屏
javascript全屏操作的更多相关文章
- JavaScript全屏显示
JavaScript全屏显示 需要引入的库 https://cdn.bootcss.com/jquery/1.9.0/jquery.min.js https://cdn.bootcss.com/scr ...
- HTML5全屏操作API
一.定义:HTML5规范允许自定义网页上的任一元素全屏显示,存在兼容问题 二.使用: ①基本: Node.RequestFullScreen()开启全屏显示 Node.CancelFullScreen ...
- HTML5--浏览器全屏操作、退出全屏、是否全屏
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- JavaScript 全屏展示
浏览器都有页面全屏的功能 F11 ,那么如何用JavaScript控制页面全屏呢?MDN上提供的的API , 一个小demo验证一下! <!DOCTYPE html> <html l ...
- Fullscreen API：全屏操作
function launchFullscreen(element) { if(element.requestFullscreen) { element.requestFullscreen(); } ...
- dos初始操作和全屏方法
1.初始操作 mount d d:\ ;选择挂载的硬盘 d:\ cd Dos cd MASM ;到达debug/edit/link/masm.exe文件的位置 ;然后可以进行debug/edit xx ...
- HTML5实现网页的全屏切换
使用HTML5提供的JavaScript Api可以实现主流浏览器的全屏和退出全屏操作,封装成进入全屏和退出全屏的函数如下: //进入全屏 function enterFullScreen() { v ...
- HTML5 全屏特性
全屏功能是浏览器很早就支持的一项功能了,可以让你页面中的video, image ,div 等等子元素实现全屏浏览,从而带来更好的视觉体验,来看看怎么使用吧.先来看看有哪些API和事件支持. API ...
- How to Use HTML5 FUll Screen API（如何使用HTML5全屏接口） 【精】
原文链接:http://www.sitepoint.com/use-html5-full-screen-api/ 如果你不太喜欢变化太快的东西,那么web开发可能不适合你.我曾在2012年末有写过Fu ...
随机推荐
- Servlet 全局验证是否登录
Java过滤器的使用和拦截排除的实现 http://blog.csdn.net/kyunchen/article/details/52187514
- flush()的原理
输出流类似于一根管道,输出的时候先放到管道里,然后管道满了存到介质上(硬盘或其他地方),当我们输出完后管道里面可能还有剩余,就用flush()清空管道即全部存到介质上.Java默认的缓冲区大小一般是8 ...
- C++中内存泄漏的几种情况
1. 在类的构造函数和析构函数中没有匹配的调用new和delete函数 两种情况下会出现这种内存泄露:一是在堆里创建了对象占用了内存,但是没有显示地释放对象占用的内存:二是在类的构造函数中动态的分配了 ...
- 利用函数或映射进行数据转换 （map）
先来看个数据 df = DataFrame({"food":["bacon", "pulled pork", "bacon&quo ...
- Failed to import package with error: Couldn't decompress package的解决方案
问题的出现 在Unity中导入一个Package文件,出现以下出错信息 解决方案 遇到这样的报错信息,一般就是要将该文件包的存储路径设置为英文,因为Unity不识别中文路径:其次对文件包的命名中间应没 ...
- Spring JDBC删除数据
以下示例将展示如何使用Spring jdbc执行删除数据库表中的记录,这里演示如何删除指定student表中的记录. 语法: String deleteQuery = "delete fro ...
- 工作所用的日常 Git 命令
几乎每个开发人员都在使用 Git,当然很可能是 GitHub.但大多数开发者大概有 99% 的时间只是使用这三个命令: #使用命令git add <file>,将文件添加到暂存区 git ...
- Miniconda 安装测试
背景: conda 是一个python的计算环境,minicoda 可以看做是conda的精简版 官网: https://conda.io/miniconda.html 安装: miniconda 支 ...
- C# 大图片压缩算法，减少图片体积
声明: 图片压缩算法,不建议对小图片进行压缩,一般文件小于1m的,真心没必要压缩, 图片很小的,例如:几百KB的图片,有可能不会减少图片体积,反而压缩后更大,也很正常, 请大家合理使用,并不是,所有图 ...
- java使用javax.mail进行免费的邮件发送
1. 建议发送方使用阿里云邮箱https://mail.aliyun.com/,阿里云默认是开启个人邮箱pop3.smtp协议的,所以无需在阿里云邮箱里设置,pop3.smtp的密码默认邮箱登录密码, ...