function FullScreen(){
var el = $('html')[0];//要全屏的元素,如果要全页面全屏,建议使用html节点而不是body节点
var isFullscreen=document.fullScreen||document.mozFullScreen||document.webkitIsFullScreen;
if(!isFullscreen){//进入全屏,多重短路表达式
(el.requestFullscreen&&el.requestFullscreen())||
(el.mozRequestFullScreen&&el.mozRequestFullScreen())||
(el.webkitRequestFullscreen&&el.webkitRequestFullscreen())||(el.msRequestFullscreen&&el.msRequestFullscreen());
}else{ //退出全屏,三目运算符
document.exitFullscreen?document.exitFullscreen():
document.mozCancelFullScreen?document.mozCancelFullScreen():
document.webkitExitFullscreen?document.webkitExitFullscreen():'';
}
}

直接调用该方法即可。

使用esc键退出全屏。

此方法的全屏和F11的全屏还是有区别的。

html5 自带全屏API调用方法的更多相关文章

  1. HTML5 全屏 API

    翻译人员: 铁锚 原文日期: 2013年12月23日 翻译日期: 2013年12月29日 原文链接: Fullscreen API 在越来越真实的web应用程序中,JavaScript也变得越来越给力 ...

  2. 使用html5中video自定义播放器必备知识点总结以及JS全屏API介绍

    一.video的js知识点: controls(控制器).autoplay(自动播放).loop(循环)==video默认的: 自定义播放器中一些JS中提供的方法和属性的记录: 1.play()控制视 ...

  3. HTML5全屏API

    现在大多数浏览器都有全屏功能,允许用户来设置或操作.但HTML5的全屏API与之不同,HTML5的全屏API允许web开发工程师在程序中调用. 这样,web开发工程师就可以再网站中设计一个按钮,当该按 ...

  4. JavaScript网页全屏API

    在大多数的浏览器中都有实现网页全屏显示的功能,并且大部分浏览器实现全屏显示和退出全屏显示的快捷键通常是F11和Esc两个按键.如今,W3C已经制定了关于网页全屏显示的API,利用这个API 可以实现网 ...

  5. 全屏API

    by zhangxinxu from http://www.zhangxinxu.com本文地址:http://www.zhangxinxu.com/wordpress/?p=2679 二.相关文章以 ...

  6. 原 HTML5 requestFullScreen&exitFullscreen全屏兼容方案

                         摘要: html5 video全屏实现方式 首先来说,这个标题具有误导性,但这样设置改标题也是主要因为video使用的比较多 在html5中,全屏方法可以适用 ...

  7. 全屏API接口

    HTML5的诞生给我们提供了很多精彩的JavaScript和HTML新功能和新特征.有些新特征我们已知多年并大量的使用,而另外一些主要是用在前沿的手机移动技术上,或者桌面应用中起辅助作用.不管这些HT ...

  8. WPF Popup全屏 弹出方法。解决只显示75%的问题。

    WPF Popup全屏 弹出方法.解决只显示75%的问题.   WPF 中 Popup 有一个特点.当Popup的高度超过屏幕的75%的时候,只显示75%的高度. 如下代码: <Window x ...

  9. HTML5轻松实现全屏视频背景

    想在你的网页首页中全屏播放一段视频吗?而这段视频是作为网页的背景,不影响网页内容的正常浏览.那么我告诉你有一款Javascript库正合你意,它就是Bideo.js. 参考网址: https://ww ...

随机推荐

  1. 信息收集1:DNSEUM命令

    1,背景 今天无意中发现了dnsenum这个工具,在网上搜了下关于dnsenum的介绍和安装使用方法,资料不是很全,但还好这个工具也算简单,网上也都有源码,可以自行下载下来阅读阅读.本人好奇在本机(u ...

  2. Python大数据:外部数据获取(网页抓取)

    import urllib2 as url import cookielib,StringIO,gzip,json import pandas as pd import numpy as np #定义 ...

  3. fork(2) - Linux man page

    fork(2): create child process - Linux man page https://linux.die.net/man/2/fork fork(2) - Linux man ...

  4. 高频访问IP弹验证码架构图 让被误伤的用户能及时自行解封的策略

    高频访问IP限制 --Openresty(nginx + lua) [反爬虫之旅] - Silbert Monaphia - CSDN博客 https://blog.csdn.net/qq_29245 ...

  5. 洛谷P3067 平衡的奶牛群 [USACO12OPEN] meet-in-the-middle

    正解:搜索 解题报告: 先放下传送门QwQ 这题就,双向搜索经典题鸭 首先dfs应该挺好想到的我jio得?就是我们不用记录左右分别得分多少只要记下差值就好了嘛能get? 然后就先搜左边,记录下每个得分 ...

  6. linux内存管理之vmalloc函数分析

    2017-07-09 今天周末,闲来无事聊聊linux内核内存分配那点事……重点在于分析vmalloc的执行 流程 以传统x86架构为例,内核空间内存(3G-4G)主要分为三大部分:DMA映射区,一致 ...

  7. python之sqlalchemy使用

    一.介绍 SQLAlchemy是一个基于Python实现的ORM框架.该框架建立在 DB API之上,使用关系对象映射进行数据库操作,简言之便是:将类和对象转换成SQL,然后使用数据API执行SQL并 ...

  8. word安装楷体gb2312方法。

    1:下载:楷体gb2312.http://www.downza.cn/soft/7732.html 2: 双击安装,将会下载楷体2312  的压缩文件,解压得到楷体2312.ttf. 3:  打开控制 ...

  9. (转)Springboot+shiro配置笔记+错误小结

    springboot不像springmvc,它没有xml配置文件,那该如何配置shiro呢,其实也不难,用java代码+注解来解决这个问题.仅以此篇记录我对shiro的学习,如有对过客造成不便,实在抱 ...

  10. VS Code 终端窗口无法输入命令的解决方案

    问题 今天打开vs code,打开终端窗口,发现不能输入命令了 解决方法 邮件桌面 vscode的快捷键,打开“兼容性”标签,勾选"以管理员身份运行此程序" 结果 修改之后重启vs ...