JavaScript全屏显示

需要引入的库

https://cdn.bootcss.com/jquery/1.9.0/jquery.min.js
https://cdn.bootcss.com/screenfull.js/3.3.2/screenfull.min.js

全屏切换

screenfull.toggle();

打开全屏

screenfull.request();

退出全屏

screenfull.exit();

指定box全屏

//html
<div id="box"></div> //js
var box = document.getElementById('box');
screenfull.request(box);

注意:全屏展示都需要一个动作触发,例如:onclick

JavaScript全屏显示的更多相关文章

  1. 【温故而知新-Javascript】窗口效果 (全屏显示窗口、定时关闭窗口)

    1.全屏显示窗口 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://ww ...

  2. javascript full screen 全屏显示 页面元素

    javascript full screen 全屏显示 页面元素 要想让页面的某个元素全屏显示,就像在网页上看视频的时候,可以全屏观看一样,该怎么实现呢? 一种最简单的方式,就是动态改变你想要全屏显示 ...

  3. JavaScript实现全屏显示

    <!doctype html> <html> <head> <title>全屏显示</title> <meta charset=&qu ...

  4. JavaScript:让浏览器全屏显示

    并不是所有人都会按F11让浏览器全屏显示~~~ 一.直接上代码 <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xh ...

  5. js控制页面的全屏展示和退出全屏显示

    <!DOCTYPE html> <html> <meta http-equiv="Content-Type" content="text/h ...

  6. 全屏显示网页FULLSCREEN API

    第一次看到应用 Fullscreen API 全屏显示网页,是 FaceBook 中的照片放大.作为一个比较新的 API,目前只有 Safari.Chrome 和 FireFox 三种浏览器支持该特性 ...

  7. 在VC++6.0开发中实现全屏显示

    全屏显示是一些应用软件程序必不可少的功能.比如在用VC++编辑工程源文件或编辑对话框等资源时,选择菜单“View\Full Screen”,即可进入全屏显示状态,按“Esc”键后会退出全屏显示状态. ...

  8. Android 全屏显示的方法(不包含状态栏)

    我们都知道在Android中某些功能的实现往往有两种方法:一种是在xml文件中设置相应属性,另一种是用代码实现.同样Android实现全屏显示也可以通过这两种方法实现: 1.在AndroidManif ...

  9. Android 全屏显示

    Android全屏显示: @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInst ...

随机推荐

  1. Openstack虚拟机创建流程

    续上一篇Openstack安装配置 一,keystone交互认证阶段 1,发送用户名和密码给keystone认证获取token 2,带着token访问nova-api 3,nova-api使用toke ...

  2. 6号css学习小记

    一.overfloat属性:(四个值) visible :默认值.内容不会被修剪,会呈现在元素匡之外. hidden:内容会被修剪,并且其余内容是不可见的. scroll :内容会被修剪,但是浏览器会 ...

  3. 《挑战程序设计竞赛》2.2 贪心法-其它 POJ3617 3069 3253 2393 1017 3040 1862 3262

    POJ3617 Best Cow Line 题意 给定长度为N的字符串S,要构造一个长度为N的字符串T.起初,T是一个空串,随后反复进行下列任意操作: 从S的头部(或尾部)删除一个字符,加到T的尾部 ...

  4. <2014 04 16> 上班实习第一天

    找了家开发3D printer的创业公司实习,做(嵌入式)软件工程师.今天第一天. 1.熟悉了基于SLA技术的3D打印机的主要关键问题,机械结构. 控制系统是基于PC-Clinet和一个树莓派ARM/ ...

  5. 解决:JQuery "Uncaught ReferenceError: $ is not defined"错误

    重登了一下emo项目,发现新建朋友功能出了问题:MultiValueDictKeyError.查看了一下报错提示,发现ajax中发送的数据包中少了两个参数. 于是调试js前端,发现console报错: ...

  6. PBR工作流

    目标是让substance效果和unity效果一致 分2步: 1.完成1个shader,效果和standard完全一致,抛去不需要的功能 2.使用新的shader,在substance里替代原有的渲染 ...

  7. MongoDB-1:安装和配置

    一.简介 MongoDB一种非关系型数据库(NoSql),是一种强大.灵活.可扩展的数据存储方式,因为MongoDB是文档模型,自由灵活很高,可以让你在开发过程中畅顺无比,对于大数据量.高并发.弱事务 ...

  8. rest_framework 认证与权限

    一  认证 1.1先写个类(认证组件) from app01 import models from rest_framework import exceptions from rest_framewo ...

  9. Webbench进行网站压力测试

    今天突然发现一个新大陆,Webbench,是linux下,用这很方便,开源,不限制并发访问次数和时间....大爱啊! 下载Webbench 使用wget  或者windows下载好导入linux也行, ...

  10. RTSP服务端转发服务(live555库中的testH264VideoStreamer.cpp和testOnDemandRTSPServer.cpp实例)

    1.h264文件的推送 testH264VideoStreamer.cpp文件的开头就定义了 char const* inputFileName = "test.264"; 后面接 ...