最近做项目用到全屏,现总结一下全屏:

1.局部全屏:H5全屏和F11有区别,在这种情况下判断全屏只需要通过H5全屏属性,无论全屏后有无滚动条都可判断。

          /**
* [isFullscreen 判断浏览器是否全屏]
* @return [全屏则返回当前调用全屏的元素,不全屏返回false]
*/
function isFullscreen(){
return document.fullscreenElement ||
document.msFullscreenElement ||
document.mozFullScreenElement ||
document.webkitFullscreenElement || false;
}

2.页面全屏:H5全屏和F11实现效果一样,根据浏览器可视区域与电脑屏幕大小做比较,但只能判断无滚动的页面。

  function isFullscreenForNoScroll(){
var explorer = window.navigator.userAgent.toLowerCase();
if(explorer.indexOf('chrome')>0){//webkit
if (document.body.scrollHeight === window.screen.height && document.body.scrollWidth === window.screen.width) {
alert("全屏");
} else {
alert("不全屏");
}
}else{//IE 9+ fireFox
if (window.outerHeight === window.screen.height && window.outerWidth === window.screen.width) {
alert("全屏");
} else {
alert("不全屏");
}
}
}

H5实现全屏与F11全屏的更多相关文章

  1. 浏览器全屏之requestFullScreen全屏与F11全屏

    一.简介 浏览器全屏有两种方式,一种是HTML5新增的requestFullscree全屏,另一种是摁F11实现的全屏,本文将详解两种全屏的特点以及实现代码. 二.requestFullscreen全 ...

  2. 20181019 记录 window.setTimeout('dofunction()',2000); - layui form 表单提交 事件 - F11全屏 事件 window.onresize

    1 延时事件 window.setTimeout('dofunction()',2000); 函数外面要有引号 如果没有引号 就不能延时执行 应该是内容进行eval,所以外层不是传递字符串的话,外层函 ...

  3. H5 video全屏与取消全屏兼容

    H5 video全屏与取消全屏各浏览器兼容,  requestFullscreen()全屏方法,exitFullscreen()退出全屏方法.兼容各个浏览器与css3兼容一样加个前缀即可. // 全屏 ...

  4. js控制全屏及退出全屏

    js控制全屏及退出全屏,网上很多代码例子,我这里需求和标准的有点出入: 1.当用户点击某按钮,触发iframe下的页面全屏. 2.不允许用户退出全屏. 解决第一点,触发全屏可以按照网上的例子,代码如下 ...

  5. div的全屏与退出全屏

    div的全屏与退出全屏 作用:将div全屏与退出全屏,一般播放器使用较多. html按钮: <button onclick="showFull();"> 全屏 < ...

  6. android开发:全屏和退出全屏

    android开发:全屏和退出全屏 from://http://blog.csdn.net/dyllove98/article/details/8831933 2013-04-21 20:31 413 ...

  7. windows蓝屏错误小全

    作者:siyizhu 日期:2005-11-27 字体大小: 小 中 大  引用内容 0 0x00000000 作业完成.  1 0x00000001 不正确的函数.  2 0x00000002 系统 ...

  8. Android开发经验一判断当前屏幕是全屏还是非全屏

    public void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView ...

  9. HTML5--浏览器全屏操作、退出全屏、是否全屏

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

随机推荐

  1. 13-jQuery的ajax

    什么是ajax AJAX = 异步的javascript和XML(Asynchronous Javascript and XML) 简言之,在不重载整个网页的情况下,AJAX通过后台加载数据,并在网页 ...

  2. 使用vlc打开usb摄像头

    打开vlc播放器 可以打开网络串流的方式打开摄像头,但只支持第一个摄像头 这一串地址拼凑方法看下面,下面可以选择摄像头 为什么只支持第一个摄像头可以参考下一篇使用Vlc.DotNet打开摄像头并截图 ...

  3. ArcGis 属性表.dbf文件使用Excel打开中文乱码的解决方法

    2019年4月 拓展: ArcGis——好好的属性表,咋就乱码了呢? 2019年3月27日补充: 在ArcMap10.3+(根据官网描述应该是,作者测试使用10.5,可行)以后的版本,可以使用ArcT ...

  4. 已知 $AB$, 求 $BA$

    设 $A,B$ 分别是 $3\times 2$ 和 $2\times 3$ 实矩阵. 若 $\dps{AB=\sex{\ba{ccc}  8&0&-4\\  -\frac{3}{2}& ...

  5. 高并发秒杀系统--Service接口设计与实现

    [DAO编写之后的总结] DAO层    -->    接口设计 + SQL编写 DAO拼接等逻辑    -->    统一在Service层完成 [Service层的接口设计] 1.接口 ...

  6. react-router v4中 HashRouter 和 BrowserRouter的使用

    遇到的问题 项目中控制路由跳转使用的是BrowserRouter,代码如下: ReactDOM.render(( <BrowserRouter> <div className=&qu ...

  7. iTOP-4418开发板Qt系统下运行摄像头测试程序

    编译环境:Ubuntu 12.04 交叉编译工具链:gcc 4.4.1 一.添加编译器的环境变量 打开~/.bashrc文件,修改环境变量,如下图:   修改完后,更新环境变量,使用命令”source ...

  8. mysql语句实战

    请创建如下表,并创建相关约束 二.操作表 1.自行创建测试数据 2.查询“生物”课程比“物理”课程成绩高的所有学生的学号:   这个比较难, 3.查询平均成绩大于60分的同学的学号和平均成绩: 4.查 ...

  9. dubbo服务运行的三种方式

    dubbo服务运行,也就是让生产服务的进程一直启动.如果生产者进程挂掉,也就不存在生产者,消费者不能进行消费. Dubbo服务运行的三种方式如下:1.使用Servlet容器运行(Tomcat.Jett ...

  10. sed追加文本-sed脚本追加文本

    input为sed输入文件,内容如下: [root@node1 gitlab-test-]# cat inppu.txt aa bb cc dd 追加文本: 1.匹配  aa 行之后追加文本 We a ...