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 ...
随机推荐
- DocFX
微软开源全新的文档生成工具DocFX 微软放弃Sandcastle有些年头了,微软最近开源了全新的文档生成工具DocFX,目前支持C#和VB,类似JSDoc或Sphinx,可以从源代码中提取注释生成文 ...
- 学习通过Thread+Handler实现非UI线程更新UI组件(转)
[Android线程机制] 出于性能考虑,Android的UI操作并不是线程安全的,这就意味着如果有多个线程并发操作UI组件,可能导致线程安全问题.为了解决这个问题,Android制定了一条简单的规则 ...
- 【Web探索之旅】第二部分第五课:响应式网站和移动应用
内容简介 1.第二部分第五课:响应式网站和移动应用 2.第三部分第一课预告:服务器 第二部分第五课:响应式网站和移动应用 在我们开始聊响应式网站之前,我们可以聊聊移动App(App是Applicati ...
- java提高篇(七)-----详解内部类
可以将一个类的定义放在另一个类的定义内部,这就是内部类. 内部类是一个非常有用的特性但又比较难理解使用的特性(鄙人到现在都没有怎么使用过内部类,对内部类也只是略知一二). 第一次见面 内部类我们从外面 ...
- Singleton模式线程相关的(C\C++)
这种需求的最新发展. 我需要一个静态类,无论地方,我可以在线程中调用它public功能对应的功能已经完成. 这个静态类会调用我初始化给它的一个指针,这个指针是与线程一一相应的: 准确来说这样的模式应该 ...
- 【Android进阶】URL与URI的区别
首先,URI,是uniform resource identifier,统一资源标识符,用来唯一的标识一个资源. 而URL是uniform resource locator,统一资源定位器,它是一种具 ...
- 百度云盘建svnserver步骤
安装tortoisesvn(略) 安装visualsvn(主server您可以使用)(略步骤)例如下面的安装文件夹后,: 注冊百度账号.进入百度云盘页面,建立目录,如mysvn. 下载百度云盘clie ...
- D其他项目打电话AL工程EF Model
Based on your description and the error code, you will just need to ensure that your DataContext ...
- 微通道产品经理Grover采访:美国的微通道设计
"'哥'在中国是一种尊称吗?哈哈.我们平时都叫张小龙'龙哥'." "是的.Dan哥,当你认为某个人牛逼的时候,你就能够叫他'哥'." 我对于Dan Grover ...
- 基于最简单的FFmpeg的AVDevice抽样(屏幕录制)
=====================================================基于最简单的FFmpeg的AVDevice样品文章: 最简单的基于FFmpeg的AVDevic ...