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. Python大数据:信用卡逾期分析

    # -*- coding:utf-8 -*- # 数据集成 import csv import numpy as np import pandas as pd import matplotlib.py ...

  2. expdp全库备份rac数据库因错误终止

    1.expdp导出日志报错如下: ORA-39014: One or more workers have prematurely exited. ORA-39029: worker 2 with pr ...

  3. web应用/http协议/web框架

    一.web应用 Web应用程序是一种可以通过Web访问的应用程序,程序的最大好处是用户很容易访问应用程序,用户只需要有浏览器即可,不需要再安装其他软件.应用程序有两种模式C/S.B/S.C/S是客户端 ...

  4. HTTP返回码中301与302的区别(转)

    add by zhj:  区别 1.使用效果不同 302跳转是暂时的跳转,搜索引擎会抓取新的内容而保留旧的网址.因为服务器返回302代码,搜索引擎认为新的网址只是暂时的. 301重定向是永久的重定向, ...

  5. pouch架构源码分析

    // daemon/daemon.go 1.func NewDaemon(cfg config.Config) *Daemon 调用containerStore, err := meta.NewSto ...

  6. Mirror--自增键在镜像中的影响

    测试环境: OS: Windows Server 2008 R2 Enterprise SQL: SQL Server 2012 Enterprise 测试场景: 有SERVER A上数据库 DB10 ...

  7. Java打包可执行jar包 包含外部文件

    外部文件在程序中设置成相对当前工程路径,执行jar包时,将外部文件放在和jar包平级的目录. public class Main { 3 public static void main(String[ ...

  8. Android 压力测试工具Monkey

    原文地址http://www.syhm52.com/tools/17.html 一.Monkey定义探索软件测试工具有哪些,本文主要介绍Monkey工具.Monkey测试是Android平台自动化测试 ...

  9. NodeJS学习笔记二

    类声明和类表达式 ES6 中的类实际上就是个函数,而且正如函数的定义方式有函数声明和函数表达式两种一样,类的定义方式也有两种,分别是:类声明.类表达式. 类声明 类声明是定义类的一种方式,就像下面这样 ...

  10. zw黑天鹅足彩实盘测试5月数据包

    [文件说明] $mx1,是单日数据:$mx9,是日数据和 入选率:2%, 准确度:40% 盈利率:120%左右 目前在测试稳定性 5月1日-6月14日,实盘数据 $mx9,15061409x15061 ...