HTML 5中的full screen,目前可以在除IE和opera外的浏览器中使用 ,有的时候用来做
全屏API,游戏呀,等都很有用。先看常见的API
1 element.requestFullScreen()
作用:请求某个元素element全屏
2
Document.getElementById(“myCanvas”).requestFullScreen()
这里是将其中的元素ID去请求fullscreen
3
退出全屏
document.cancelFullScreen()
4
Document.fullScreen
如果用户在全屏模式下,则返回true
5 document.fullScreenElement
返回当前处于全屏模式下的元素
下面的代码是开启全屏模式:
- function fullScreen(element) {
- if(element.requestFullScreen) {
- element.requestFullScreen();
- } else if(element.webkitRequestFullScreen ) {
- element.webkitRequestFullScreen();
- } else if(element.mozRequestFullScreen) {
- element.mozRequestFullScreen();
- }
- }
下面的代码就是整个页面调用全屏模式
var html = document.documentElement;
fullScreen(html);
下面的则是对指定元素,比如
var canvas = document.getElementById('mycanvas');
fullScreen(canvas);
如果要取消,同样:
- // the helper function
- function fullScreenCancel() {
- if(document.requestFullScreen) {
- document.requestFullScreen();
- } else if(document .webkitRequestFullScreen ) {
- document.webkitRequestFullScreen();
- } else if(document .mozRequestFullScreen) {
- document.mozRequestFullScreen();
- }
- }
- fullScreenCancel();
不过老实说,FULL SCREEN有个问题,容易造成欺骗,比如在
http://feross.org/html5-fullscreen-api-attack/中,其中就有一个很好的DEMO,
去欺骗了,比如某个链结写的是http://www.bankofamerica.com,大家以为是美国银行,
一点进去,因为使用了全屏幕API,就会欺骗到人
- $('html').on('click keypress', 'a', function(event) {
- // 不响应真正的A HREF点击事件
- event.preventDefault();
- event.stopPropagation();
- // Trigger fullscreen
- if (elementPrototype.requestFullscreen) {
- document.documentElement.requestFullscreen();
- } else if (elementPrototype.webkitRequestFullScreen) {
- document.documentElement.webkitRequestFullScreen(Element.ALLOW_KEYBOARD_INPUT);
- } else if (elementPrototype.mozRequestFullScreen) {
- document.documentElement.mozRequestFullScreen();
- } else {
- //
- }
- //显示假的UI
- $('#menu, #browser').show();
- $('#target-site').show();
- });
详细代码在https://github.com/feross/fullscreen-api-attack可以下载
老外也提到了:
Browser vendors are well aware of the potential security issues with fullscreen. For example, a malicious site could show a full screen Windows or Mac login window and steal a password. That’s why they are disabling keyboard support by default and only enabling by explicitly asking. — John Dyer
相关推荐
【PHP】基于ThinkPHP 5.0的考试系统tp5
资源说明: 1:csdn平台资源详情页的文档预览若发现'异常',属平台多文档混合解析和叠加展示风格,请放心使用。 2:32页图文详解文档(从零开始项目全套环境工具安装搭建调试运行部署,保姆级图文详解)。 3:34页范例参考毕业论文,万字长文,word文档,支持二次编辑。 4:27页范例参考答辩ppt,pptx格式,支持二次编辑。 5:工具环境、ppt参考模板、相关教程资源分享。 6:资源项目源码均已通过严格测试验证,保证能够正常运行,本项目仅用作交流学习参考,请切勿用于商业用途。 7:项目问题、技术讨论,可以给博主私信或留言,博主看到后会第一时间与您进行沟通。 内容概要: 本系统基于 B/S 网络结构,在IDEA中开发。服务端用 Java 并借 ssm 框架(Spring+SpringMVC+MyBatis)搭建后台。前台采用支持 HTML5 的 VUE 框架。用 MySQL 存储数据,可靠性强。 能学到什么: 学会用ssm搭建后台,提升效率、专注业务。学习 VUE 框架构建交互界面、前后端数据交互、MySQL管理数据、从零开始环境搭建、调试、运行、打包、部署流程。
三台松下的PLC一起通信控制16轴的程序,表格定位,用于固态硬盘的组装,精密度要求高,手动,自动、报景、空机运行等,程序写法新颖,清晰明了,注释清晰易懂,是学习多台PLC并联和定位控制非常好的栗子
资源说明: 1:csdn平台资源详情页的文档预览若发现'异常',属平台多文档混合解析和叠加展示风格,请放心使用。 2:32页图文详解文档(从零开始项目全套环境工具安装搭建调试运行部署,保姆级图文详解)。 3:34页范例参考毕业论文,万字长文,word文档,支持二次编辑。 4:27页范例参考答辩ppt,pptx格式,支持二次编辑。 5:工具环境、ppt参考模板、相关教程资源分享。 6:资源项目源码均已通过严格测试验证,保证能够正常运行,本项目仅用作交流学习参考,请切勿用于商业用途。 7:项目问题、技术讨论,可以给博主私信或留言,博主看到后会第一时间与您进行沟通。 内容概要: 本系统基于 B/S 网络结构,在 IDEA 中开发。服务端用 Java 并借 ssm 框架(Spring+SpringMVC+MyBatis)搭建后台。用 MySQL 存储数据,可靠性强。 能学到什么: 学会用ssm搭建后台,提升效率、专注业务。学习使用jsp、html构建交互界面、前后端数据交互、MySQL管理数据、从零开始环境搭建、调试、运行、打包、部署流程。
【课程设计】基于pytorch实现Transformer模型的最简洁方式源码+模型+详细注释+运行说明.zip
资源说明: 1:csdn平台资源详情页的文档预览若发现'异常',属平台多文档混合解析和叠加展示风格,请放心使用。 2:32页图文详解文档(从零开始项目全套环境工具安装搭建调试运行部署,保姆级图文详解)。 3:34页范例参考毕业论文,万字长文,word文档,支持二次编辑。 4:27页范例参考答辩ppt,pptx格式,支持二次编辑。 5:工具环境、ppt参考模板、相关教程资源分享。 6:资源项目源码均已通过严格测试验证,保证能够正常运行,本项目仅用作交流学习参考,请切勿用于商业用途。 7:项目问题、技术讨论,可以给博主私信或留言,博主看到后会第一时间与您进行沟通。 内容概要: 本系统基于 B/S 网络结构,在 IDEA 中开发。服务端用 Java 并借 ssm 框架(Spring+SpringMVC+MyBatis)搭建后台。用 MySQL 存储数据,可靠性强。 能学到什么: 学会用ssm搭建后台,提升效率、专注业务。学习使用jsp、html构建交互界面、前后端数据交互、MySQL管理数据、从零开始环境搭建、调试、运行、打包、部署流程。
【课程设计】基于keil手机菜单系统仿真程序源码.zip
内容概要:本文介绍了HBase与Cassandra这两种大数据存储技术的实际应用场景,主要侧重于Cassandra的具体实施细节。首先详细展示了Cassandra在单个节点上的部署与配置步骤,如下载软件包、解压、启动与连接等基本操作。其次深入讲解了多节点环境下Cassandra的分布式部署,涵盖环境准备(包括关闭防火墙、设置无密码登陆)、文件上传与配置编辑直至最后的启动检查。进一步,文章通过建立图书管理系统来演示如何利用CQL进行数据库的基本操作(CRUD),从定义库结构(如创建Keyspaces和表格)、键值设置再到数据的增、删、改、查操作流程都有涉及。此外,提供了具体的Python代码示例指导用户完成基于Cassandra的图书管理系统编程实战部分,从而巩固对于所讲概念和技术点的理解。 使用场景及目标:旨在让读者熟悉NoSQL数据库特性,尤其是面向非结构化数据处理时的优势;掌握Cassandra这种分布式的NoSQL数据库系统的架构设计与运维方法;最终能够在实际项目中独立运用Cassandra搭建高效能的应用程序,像文中提到的图书管理系统。
PDD盈利增长特训营教程
基于配电网有功电压控制的多智能体强化学习,python代码,可以发中文核心或者中文ei,非常好的代码
塑料链板输送机sw16可编辑全套技术资料100%好用.zip
毕业设计基于python+pyqt5+sqlite3的学生通讯录管理系统源码,个人大四的毕业设计、经导师指导并认可通过的高分设计项目,评审分99分,代码完整确保可以运行,小白也可以亲自搞定,主要针对计算机相关专业的正在做毕设的学生和需要项目实战练习的学习者,也可作为课程设计、期末大作业。 毕业设计基于python+pyqt5+sqlite3的学生通讯录管理系统源码毕业设计基于python+pyqt5+sqlite3的学生通讯录管理系统源码毕业设计基于python+pyqt5+sqlite3的学生通讯录管理系统源码毕业设计基于python+pyqt5+sqlite3的学生通讯录管理系统源码毕业设计基于python+pyqt5+sqlite3的学生通讯录管理系统源码毕业设计基于python+pyqt5+sqlite3的学生通讯录管理系统源码毕业设计基于python+pyqt5+sqlite3的学生通讯录管理系统源码毕业设计基于python+pyqt5+sqlite3的学生通讯录管理系统源码毕业设计基于python+pyqt5+sqlite3的学生通讯录管理系统源码毕业设计基于python
内容概要:这篇结题报告详细介绍了从220V交流电到5V直流电的小功率手机充电器设计方案。整个充电器设计由四大部分组成:变压器降压,桥式整流电路,LC低通滤波及基于Buck电路的降压斩波电路。其中Buck电路是重点讨论的内容之一,它不仅起到了重要的电压调整角色并且在PWM调制方式下可以实现对电压精确的控制。文中通过理论推导以及数学公式,阐述了不同组件的选择理由及依据,并结合具体实例给出了关键元件的选型计算。为了进一步验证此设计的效果,还建立了完整的充电器Simulink仿真环境,分别针对两种典型负载情况(轻载及突加双倍负载)、短路保护三种工况进行了多次实验测试,并最终得出所提出设计方案可以在较大幅范围内保证5V输出电压稳定性。 适用人群:本文适用于电力电子技术领域的科研人员和技术爱好者,特别是那些专注于小功率电源设计的研究群体。 使用场景及目标:本项目的实施旨在帮助理解现代手机充电器的基本工作原理及其各组件的具体运作机制;通过对Buck电路和PWM调制的理解和掌握解决实际工程中遇到的问题。 其他说明:报告引用了一些相关文献,提供了深入探讨某些细节的基础资料。此外,所有设计都基于MATLAB/Simulink仿真工具完成,为后续可能的实物制造提供了有力支持。这表明了MATLAB/Simulink在现代电子设计流程里的重要地位。
基于绿证-阶梯式碳交易交互的源荷互补调度优化 23年新鲜代码,基本完成四个场景的复现。 程序注释齐全 针对多能精合的区域综合能源系统的低经济运行问题,提出基于绿证-阶梯式碳交易交与的源荷互补优化调度模型。 首先,通过引入绿证-阶梯式碳交易交互机制来提高源侧可再生能源的消纳水平和降低系统碳排放量,其次,在负荷侧引入考用户满意度的激励型需求响应和调峰收益来实现热电负荷的\\\"峰填公”。 最后以日运行成本最小化为标。
Carsim与matlab simulink联合仿真,线控转向,四轮电动汽车转向失效容错控制模型,提供参考文献
该项目基于 Flask 框架开发,用于提供音乐数据分析与可视化功能,涉及用户管理、音乐数据爬取、聚类分析及其可视化展示。系统包含用户和管理员角色,提供丰富的页面功能。 主要功能: 用户登录与注册 音乐数据展示与搜索 管理员管理用户与音乐数据 K-Means 聚类分析及其可视化 数据爬取与存储 运行环境: 语言: Python 3.x 依赖库: Flask (Web 框架) pymysql (数据库操作) sklearn (聚类算法) matplotlib (可视化) WordCloud (词云生成) 数据库: MySQL
【java】基于jsp+servlet+mysql+tomcat的在线考试系统_pgj
低秩矩阵分解代码 用于图像、信号等杂波去除 Matlab实现 算法较新,实现效果好。
锂离子电池恒流恒压充电Simulink仿真模型(CC-CV) 电路结构包括:直流电压源、DC DC变器、锂离子电池、CCCV控制系统 赠送2000多字的说明文档和参考文献,帮助您更快理解 恒流恒压充电过程: [1]在CC阶段对电池施加恒定电流,以获得更快的充电速度,此时电池电压持续升高,经过一段时间后达到预设的最大电压,但是由于极化的存在,充电过程中测量的电池电压要大于实际的电池电压;所以还需要进入CV阶段继续充电 [2]在CV阶段电压保持恒定,电流呈指数级下降,极化电压逐渐降低,测量的电池电压更加接近于电池真实电压,当充电电流减小到一定值或SOC升高到一定值时,可以认为电池已经完全充电。
资源说明: 1:csdn平台资源详情页的文档预览若发现'异常',属平台多文档混合解析和叠加展示风格,请放心使用。 2:32页图文详解文档(从零开始项目全套环境工具安装搭建调试运行部署,保姆级图文详解)。 3:34页范例参考毕业论文,万字长文,word文档,支持二次编辑。 4:27页范例参考答辩ppt,pptx格式,支持二次编辑。 5:工具环境、ppt参考模板、相关教程资源分享。 6:资源项目源码均已通过严格测试验证,保证能够正常运行,本项目仅用作交流学习参考,请切勿用于商业用途。 7:项目问题、技术讨论,可以给博主私信或留言,博主看到后会第一时间与您进行沟通。 内容概要: 本系统基于 B/S 网络结构,在IDEA中开发。服务端用 Java 并借 ssm 框架(Spring+SpringMVC+MyBatis)搭建后台。前台采用支持 HTML5 的 VUE 框架。用 MySQL 存储数据,可靠性强。 能学到什么: 学会用ssm搭建后台,提升效率、专注业务。学习 VUE 框架构建交互界面、前后端数据交互、MySQL管理数据、从零开始环境搭建、调试、运行、打包、部署流程。