H5实现全屏与F11全屏
最近做项目用到全屏,现总结一下全屏:
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全屏的更多相关文章
- 浏览器全屏之requestFullScreen全屏与F11全屏
一.简介 浏览器全屏有两种方式,一种是HTML5新增的requestFullscree全屏,另一种是摁F11实现的全屏,本文将详解两种全屏的特点以及实现代码. 二.requestFullscreen全 ...
- 20181019 记录 window.setTimeout('dofunction()',2000); - layui form 表单提交 事件 - F11全屏 事件 window.onresize
1 延时事件 window.setTimeout('dofunction()',2000); 函数外面要有引号 如果没有引号 就不能延时执行 应该是内容进行eval,所以外层不是传递字符串的话,外层函 ...
- H5 video全屏与取消全屏兼容
H5 video全屏与取消全屏各浏览器兼容, requestFullscreen()全屏方法,exitFullscreen()退出全屏方法.兼容各个浏览器与css3兼容一样加个前缀即可. // 全屏 ...
- js控制全屏及退出全屏
js控制全屏及退出全屏,网上很多代码例子,我这里需求和标准的有点出入: 1.当用户点击某按钮,触发iframe下的页面全屏. 2.不允许用户退出全屏. 解决第一点,触发全屏可以按照网上的例子,代码如下 ...
- div的全屏与退出全屏
div的全屏与退出全屏 作用:将div全屏与退出全屏,一般播放器使用较多. html按钮: <button onclick="showFull();"> 全屏 < ...
- android开发:全屏和退出全屏
android开发:全屏和退出全屏 from://http://blog.csdn.net/dyllove98/article/details/8831933 2013-04-21 20:31 413 ...
- windows蓝屏错误小全
作者:siyizhu 日期:2005-11-27 字体大小: 小 中 大 引用内容 0 0x00000000 作业完成. 1 0x00000001 不正确的函数. 2 0x00000002 系统 ...
- Android开发经验一判断当前屏幕是全屏还是非全屏
public void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView ...
- HTML5--浏览器全屏操作、退出全屏、是否全屏
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
随机推荐
- 深入理解PHP的运行模式
PHP运行模式有4钟:1)cgi 通用网关接口(Common Gateway Interface))2) fast-cgi 常驻 (long-live) 型的 CGI3) cli 命令行运行 ( ...
- win+R启动列表
屌丝才用windows,无奈~ """ Win+R 快速启动的命令: 系统应用程序: calc - 启动计算器 charmap - 启动字符映射表 chkdsk - Ch ...
- fzyzojP1635 -- 平均值
做法大概有两种: 1.二分平均值,每个值减去平均值,求有没有一个区间的总和大于等于0 (类比,中位数是二分之后,比mid大的为1,小的为0,看有没有区间大于等于0这样) 最值问题——判定问题 单调队列 ...
- Linux Centos7.x下安装部署Jira和confluence以及破解方法详述
简述 JIRA是Atlassian公司出品的项目与事务跟踪工具,被广泛应用于缺陷跟踪.客户服务.需求收集.流程审批.任务跟踪.项目跟踪和敏捷管理等工作领域. Confluence是一个专业的企业知识管 ...
- mysql加速导入数据的简单设置
mysql加速导入数据的简单设置 # 修改前查询参数值 show variables like 'foreign_key_checks'; show variables like 'unique_ch ...
- Linux记录-grafana opentsdb安装
wget https://dl.grafana.com/oss/release/grafana-6.1.4-1.x86_64.rpm sudo yum localinstall grafana-6.1 ...
- Nginx web 服务器 安装篇
Nginx介绍: 静态web服务器有Nginx .Apache .lighttpd等 目前国内用的最常见的就是Nginx 和Apache 是一个开源的.支持高性能.高并发的www服务和代理服务软件,N ...
- 新手入门django本地化服务
自动化安装 #更新依赖库 pip install --upgrade setuptools #安装指定的版本 pip install Django==2.0.4 文 ...
- Ubuntu 16.04下安装MySQL及远程连接
最近因为要研究一个关于MySQL的漏洞,所以需要MySQL的环境,就用了近一个小时的时间搭建了一个,期间出了点问题,故记录于此. 1.首先是安装,在命令窗口中输入下面三条命令即可. sudo apt- ...
- 【原创】大数据基础之Kudu(2)移除dead tsever
当kudu有tserver下线或者迁移或者修改hostname之后,旧的tserver会一直以dead状态出现,并且tserver日志中会有大量的连接重试日志,一天的错误日志会有几个G, W0322 ...