javascript获取浏览器窗口大小办法
四个属性:
1:outerWidth 2:outerHeight 3:innerWidth 4:innerHeight
经最新版本的浏览器(Chrom IE Firefox Opera)测试,初步结果如下:
1:outerWidth与outerHeight
IE9+,Safari,Firefox :窗口本身加边框(指的是整个Brower);
Chrom,Opera: 页面视图容器(不包含边框) 。
2:innerWidth,innerHeight
IE9+,Safari,Firefox :可视区域;
Chrom,Opera: 可视区域 。
获取可视区域宽度和高度的跨浏览器兼容性方法:
var pageWidth = window.innerWidth,
pageHeight = window.innerHeight;
if(typeof pageWidth != "number"){ //IE兼容性问题
if(document.compatMode == "CSS1Compat"){
pageWidth = document.documentElement.clientWidth; //适合移动版IE 其他移
//浏览器中获取的是页面渲染后的实际大小
pageHeight = document.documentElement.clientHeight; //只有IE在标准模式下有用
} else{
pageWidth = document.body.clientWidth; //混杂模式下的IE
pageHeight = document.body.clientHeight;
}
}
javascript获取浏览器窗口大小办法的更多相关文章
- Javascript获取浏览器窗口大小 获取屏幕,浏览器,网页高度宽度
/******************** * 取窗口滚动条高度 ******************/function getScrollTop(){ var scrollTop=0; ...
- javascript获取浏览器窗口大小
var w=window.innerWidth || document.documentElement.clientWidth || document.body.clientWidth; var h= ...
- JS 获取浏览器窗口大小clientWidth、offsetWidth、scrollWidth
常用: JS 获取浏览器窗口大小 // 获取窗口宽度 if (windows.innerWidth) winWidth = windows.innerWidth; else if ((docume ...
- JavaScript获取浏览器类型与版本
从网上找到一段使用JavaScript判断浏览器以及浏览器版本的比较好的代码,在此记录一下: <script type="text/javascript"> var S ...
- JS 获取浏览器窗口大小
JS 获取浏览器窗口大小 <script> // 获取窗口宽度 if (windows.innerWidth) { winWidth = windows.innerWidth; } els ...
- JavaScript获取浏览器版本等信息
** 不同浏览器版本可能存在差异,使用时请测试自己的环境 ** 测试时各个浏览器版本 IE: 11.953.14393.0 Edge: Microsoft Edge 38.14393.0.0;Micr ...
- JavaScript学习总结(十八)——JavaScript获取浏览器类型与版本
从网上找到一段使用JavaScript判断浏览器以及浏览器版本的比较好的代码,在此记录一下: 1 <script type="text/javascript"> 2 v ...
- js获取浏览器窗口大小
摘抄:https://blog.csdn.net/qq_27628085/article/details/81947478 常用: JS 获取浏览器窗口大小 // 获取窗口宽度 if ...
- JS获取浏览器窗口大小 获取屏幕,浏览器,网页高度宽度
网页可见区域宽:document.body.clientWidth 网页可见区域高:document.body.clientHeight 网页可见区域宽:document.body.offsetWid ...
随机推荐
- Directx11学习笔记【十四】 使用最新的Effect框架和SDK
由于之前一直在看directx11龙书学习,因此sdk一直用的Microsoft DirectX SDK (June 2010) 版本,最近在stackoverflow上问dx11相关问题时,一直被大 ...
- UI标签库的话题:JEECG智能开发平台 BaseTag(样式表和JS标签的引入)
UI标签库专题一:JEECG智能开发平台 BaseTag(样式表和JS引入标签) 1.BaseTag(样式表和JS引入标签) 1.1. 演示样例 <t:base type="jquer ...
- 错误: 无法找到或可以不被加载到主类 Main
于eclipse导入Javaproject,执行错误:错误: 无法找到或可以不被加载到主类 Main! 百思不得其解,该解决方案是非常在线,但不是正确的方式,最后,例如,由下列溶液: 打开debug ...
- Zen Coding 快速编写HTML/CSS代码的实现
在本文中我们将展示一种新的使用仿CSS选择器的语法来快速开发HTML和CSS的方法.它由Sergey Chikuyonok开发. 你在写HTML代码(包括所有标签.属性.引用.大括号等)上花费多少时间 ...
- Linux互斥和同步应用程序(四):posix互斥信号和同步
[版权声明:尊重原创.转载请保留源:blog.csdn.net/shallnet 要么 .../gentleliu,文章仅供学习交流,请勿用于商业用途] 在前面讲共享内 ...
- [cocos2dx注意事项014]一个用于cocos2dx对象智能指针模板
现在,C++有许多实现智能指针,一个更无所谓.哈. 这种智能指针是专为cocos2dx 2.2.x自定义.主要的易用性,同时必须遵循现有的cocos2dx内存管理.特殊实现这样的智能指针.无需在使用时 ...
- Chapter 2 User Authentication, Authorization, and Security(4):限制SA帐户管理权限
原版的:http://blog.csdn.net/dba_huangzj/article/details/38817915,专题文件夹:http://blog.csdn.net/dba_huangzj ...
- MemCache分布式内存对象缓存系统
MemCache超详细解读 MemCache是一个自由.源码开放.高性能.分布式的分布式内存对象缓存系统,用于动态Web应用以减轻数据库的负载.它通过在内存中缓存数据和对象来减少读取数据库的次数,从而 ...
- 懵懵懂懂初识J2EE
一.定义 Java2平台包含:标准版.企业版.微缩版.当中J2SE是Java2的标准版,主要用 于桌面应用软件的编程:J2ME是微缩版,主要应用于嵌入式系统开发:还有这次学习的J2EE是Java2的企 ...
- C#中的动态特性
众所周知,C#和Java一样,都是一门静态语言.在C# 4.0之前,想要和动态语言(诸如Python.Javascript等)进行方便地互操作是一件不太容易的事情.而C# 4.0为我们带来的dynam ...