【转】关于JS对屏幕的计算详解
在一次工作中,遇到一菜单对屏幕的高度进行移动.在各浏览器下屏幕的计算值有所差异,对屏幕各属性计算做了一个小测试,希望能给大家有所帮助.
以下是IE新开页面屏幕计算默认值:
FF与IE都支持(计算有差异)网页可见区域宽【document.body.clientWidth】:1239
FF与IE都支持(计算有差异)网页可见区域高【document.body.clientHeight】:0
FF与IE都支持(计算有差异)网页可见区域宽【document.body.offsetWidth】:1239
FF与IE都支持(计算有差异)网页可见区域高【document.body.offsetHeight】:0
FF与IE都支持(计算有差异)网页正文全文宽【document.body.scrollWidth】:1239
FF与IE都支持(计算有差异)网页正文全文高【document.body.scrollHeight】:0
FF与IE都支持(计算相同)网页被卷去的高【document.body.scrollTop】:0
FF与IE都支持(计算相同)网页被卷去的宽【document.body.scrollLeft】:0
只支持IE:网页正文部分上【window.screenTop】:144
只支持IE:网页正文部分左【window.screenLeft】:0
FF与IE都支持(计算相同):屏幕分辨率的高【window.screen.height】:1024
FF与IE都支持(计算相同):屏幕分辨率的宽【window.screen.width】:1280
FF与IE都支持(计算相同):屏幕可用工作区高度【window.screen.availHeight】:990
FF与IE都支持(计算相同):屏幕可用工作区宽度【window.screen.availWidth】:1280
FF与IE都支持(计算有差异):窗体左【document.body.offsetLeft】与右【document.body.offsetTop】:10和15
FF与IE都支持(计算有差异):窗体高【document.body.offsetWidth】与宽【document.body.offsetHeight】:1239和0
垂直方向滚动的值【document.documentElement.scrollTop】:0
只支持FF浏览器整个宽高,不包括工具条【window.innerHeight】:undefined
FF与IE都支持(计算有差异)网页内容可视区域的高度【document.documentElement.clientHeight】:820
FF与IE都支持(计算相同):获取位于对象最顶端和窗口中可见内容的最顶端之间的距离【document.documentElement.scrollTop】:0
对IE浏览器各属性的计算范围:
以下是FF新开页面屏幕计算默认值:
以下是新开页面屏幕计算默认值:
FF与IE都支持(计算有差异)网页可见区域宽【document.body.clientWidth】:1264
FF与IE都支持(计算有差异)网页可见区域高【document.body.clientHeight】:0
FF与IE都支持(计算有差异)网页可见区域宽【document.body.offsetWidth】:1264
FF与IE都支持(计算有差异)网页可见区域高【document.body.offsetHeight】:0
FF与IE都支持(计算有差异)网页正文全文宽【document.body.scrollWidth】:1264
FF与IE都支持(计算有差异)网页正文全文高【document.body.scrollHeight】:0
FF与IE都支持(计算相同)网页被卷去的高【document.body.scrollTop】:0
FF与IE都支持(计算相同)网页被卷去的宽【document.body.scrollLeft】:0
只支持IE:网页正文部分上【window.screenTop】:undefined
只支持IE:网页正文部分左【window.screenLeft】:undefined
FF与IE都支持(计算相同):屏幕分辨率的高【window.screen.height】:1024
FF与IE都支持(计算相同):屏幕分辨率的宽【window.screen.width】:1280
FF与IE都支持(计算相同):屏幕可用工作区高度【window.screen.availHeight】:990
FF与IE都支持(计算相同):屏幕可用工作区宽度【window.screen.availWidth】:1280
FF与IE都支持(计算有差异):窗体左【document.body.offsetLeft】与右【document.body.offsetTop】:0和0
FF与IE都支持(计算有差异):窗体高【document.body.offsetWidth】与宽【document.body.offsetHeight】:1264和0
垂直方向滚动的值【document.documentElement.scrollTop】:0
只支持FF浏览器整个宽高,不包括工具条【window.innerHeight】:829
FF与IE都支持(计算有差异)网页内容可视区域的高度【document.documentElement.clientHeight】:858
FF与IE都支持(计算相同):获取位于对象最顶端和窗口中可见内容的最顶端之间的距离【document.documentElement.scrollTop】:0
以上数据表明:在FF与IE下,在计算屏幕宽度时,FF比IE多 25个像素.
- 大小: 16.9 KB
分享到:
相关推荐
通常Boost功率电路的PFC有三种工作模式:连续、临界连续和断续模式。控制方式是输入电流跟踪输入电压。连续模式有峰值电流控制,平均电流控制和滞环控制等。文章介绍了关于PFC电感计算的详细过程。
双柱联合基础的计算分析 较为详细 word文档。。。。。。
单级PFC高频变压器设计及参数计算详解pdf,单级PFC高频变压器设计及参数计算详解.pdf
javascript避免数字计算精度误差的方法详解.docx
可信计算应用技术内幕详解可信计算应用技术内幕详解可信计算应用技术内幕详解可信计算应用技术内幕详解可信计算应用技术内幕详解
关于计算机端口的一些详解 关于计算机端口的一些详解关于计算机端口的一些详解关于计算机端口的一些详解
1.移动通信领域5G NR理论速率计算详解,包括FDD和TDD协议,通俗易懂,小白也能理解,也会学会怎么计算 2.不停留在理论层面,从实际产品层面出发,将所有影响5G NR速率的因素一一进行计算说明 3.对于手机等终端能理解...
盈建科YJK计算参数详解—结构总体信息.pdf盈建科YJK计算参数详解—结构总体信息.pdf盈建科YJK计算参数详解—结构总体信息.pdf盈建科YJK计算参数详解—结构总体信息.pdf盈建科YJK计算参数详解—结构总体信息.pdf
lvds液晶屏幕接口详解(1).pdflvds液晶屏幕接口详解(1).pdflvds液晶屏幕接口详解(1).pdflvds液晶屏幕接口详解(1).pdflvds液晶屏幕接口详解(1).pdf
js的日期函数详解js的日期函数详解js的日期函数详解js的日期函数详解js的日期函数详解js的日期函数详解
Android 屏幕分辨率详解,对应的屏幕大小,像素
关于origin计算面积的详解.doc
JavaScript动态网页开发详解 非常适合做动态网页的开发
子网掩码的计算与划分详解,子网掩码的计算与划分详解
Javascript各种效果需求详解 Javascript各种效果需求详解 Javascript各种效果需求详解 Javascript各种效果需求详解
Adaboost计算过程详解
lvds液晶屏幕接口详解.pdf
《快意编程:Ext JS Web开发技术详解》首先对Ext JS进行了概述,然后通过一个简单的示例带领读者快速入门,在读者对Ext JS有了初步印象后,又重点介绍了JavaScript的面向对象技术、Ext JS API文档的使用方法、Ext JS...
Windows8.1屏幕键盘详解.docx
资源名称:完全手册--Javascript动态网页开发详解 (杨水清等著) 内容简介: 你还认为Javascript只能制作网页特效,那就大错特错了。现在网络领域最流行的理念是Web 2.0,而该理念的技术...