IE中:
document.body.clientWidth ==> BODY对象宽度
document.body.clientHeight ==> BODY对象高度
document.documentElement.clientWidth ==> 可见区域宽度
document.documentElement.clientHeight ==> 可见区域高度
FireFox中:
document.body.clientWidth ==> BODY对象宽度
document.body.clientHeight ==> BODY对象高度
document.documentElement.clientWidth ==> 可见区域宽度
document.documentElement.clientHeight ==> 可见区域高度
Opera中:
document.body.clientWidth ==> 可见区域宽度
document.body.clientHeight ==> 可见区域高度
document.documentElement.clientWidth ==> 页面对象宽度(即BODY对象宽度加上Margin宽)
document.documentElement.clientHeight ==> 页面对象高度(即BODY对象高度加上Margin高)
没有定义W3C的标准,则
IE为:
document.documentElement.clientWidth ==> 0
document.documentElement.clientHeight ==> 0
FireFox为:
document.documentElement.clientWidth ==> 页面对象宽度(即BODY对象宽度加上Margin宽)
document.documentElement.clientHeight ==> 页面对象高度(即BODY对象高度加上Margin高)
Opera为:
document.documentElement.clientWidth ==> 页面对象宽度(即BODY对象宽度加上Margin宽)
document.documentElement.clientHeight ==> 页面对象高度(即BODY对象高度加上Margin高)

网页可见区域宽: document.body.clientWidth
网页可见区域高: document.body.clientHeight
网页可见区域宽: document.body.offsetWidth (包括边线的宽)
网页可见区域高: document.body.offsetHeight (包括边线的高)
网页正文全文宽: document.body.scrollWidth
网页正文全文高: document.body.scrollHeight
网页被卷去的高: document.body.scrollTop
网页被卷去的左: document.body.scrollLeft
网页正文部分上: window.screenTop
网页正文部分左: window.screenLeft
屏幕分辨率的高: window.screen.height
屏幕分辨率的宽: window.screen.width
屏幕可用工作区高度: window.screen.availHeight
屏幕可用工作区宽度: window.screen.availWidth

HTML精确定位:scrollLeft,scrollWidth,clientWidth,offsetWidth
scrollHeight: 获取对象的滚动高度。
scrollLeft:设置或获取位于对象左边界和窗口中目前可见内容的最左端之间的距离
scrollTop:设置或获取位于对象最顶端和窗口中可见内容的最顶端之间的距离
scrollWidth:获取对象的滚动宽度
offsetHeight:获取对象相对于版面或由父坐标 offsetParent 属性指定的父坐标的高度
offsetLeft:获取对象相对于版面或由 offsetParent 属性指定的父坐标的计算左侧位置
offsetTop:获取对象相对于版面或由 offsetTop 属性指定的父坐标的计算顶端位置
event.clientX 相对文档的水平座标
event.clientY 相对文档的垂直座标
event.offsetX 相对容器的水平坐标
event.offsetY 相对容器的垂直坐标
document.documentElement.scrollTop 垂直方向滚动的值
event.clientX+document.documentElement.scrollTop 相对文档的水平座标+垂直方向滚动的量

黄聪:js 获取浏览器、Body、滚动条、可见区域、页面、边框、窗口高度和宽度值(多浏览器)的更多相关文章

  1. 【转】js 获取浏览器高度和宽度值(多浏览器

    原文地址:http://www.jb51.net/article/19844.htm js获取浏览器高度和宽度值,尽量的考虑了多浏览器. IE中: document.body.clientWidth ...

  2. js 获取浏览器高度和宽度值(多浏览器)(转)

    IE中: document.body.clientWidth ==> BODY对象宽度 document.body.clientHeight ==> BODY对象高度 document.d ...

  3. js 获取浏览器高度和宽度值(多浏览器)

    IE中: document.body.clientWidth ==> BODY对象宽度 document.body.clientHeight ==> BODY对象高度 document.d ...

  4. [转]js 获取浏览器高度和宽度值(多浏览器)(js获取宽度高度大全)

    IE中: document.body.clientWidth ==> BODY对象宽度 document.body.clientHeight ==> BODY对象高度 document.d ...

  5. js获取浏览器高度和宽度值,尽量的考虑了多浏览器。

    js获取浏览器高度和宽度值,尽量的考虑了多浏览器. IE中: document.body.clientWidth ==> BODY对象宽度 document.body.clientHeight ...

  6. 关于JS中获取浏览器高度和宽度值的多种方法(多浏览器)

    三种浏览器获取值方法 IE中: document.body.clientWidth ==> BODY对象宽度 document.body.clientHeight ==> BODY对象高度 ...

  7. JavaScript获取浏览器高度和宽度值(documentElement,clientHeight,offsetHeight,scrollHeight,scrollTop,offsetParent,offsetY,innerHeight)

    IE中: document.body.clientWidth ==> BODY对象宽度 document.body.clientHeight ==> BODY对象高度 document.d ...

  8. JavaScript获取浏览器高度和宽度值

    IE中:  document.body.clientWidth ==> *DY对象宽度 document.body.clientHeight ==> *DY对象高度 document.do ...

  9. 页面间(窗口间)的取值赋值及获取iframe下的window对象

    ①同一个窗口中,获取某个iframe的信息 <body> <iframe id="PAID" name="PA" src="Item ...

随机推荐

  1. Maven .m2文件夹创建

    settings.xml存在于两个地方: 1.安装的地方:$M2_HOME/conf/settings.xml 2.用户的目录:${user.home}/.m2/settings.xml 前者又被叫做 ...

  2. CentOS7.2 安装Redis3.2.8

    Redis3.2.8 下载 下载Redis3.2.8.tar.gz 将文件放置在usr/local/redis/中 解压文件 安装: make && make install [roo ...

  3. HDU 4990 Reading comprehension(矩阵快速幂)题解

    思路: 如图找到推导公式,然后一通乱搞就好了 要开long long,否则红橙作伴 代码: #include<set> #include<cstring> #include&l ...

  4. Maven简单的配置Junit测试及使用简单的mock

    1.maven依赖配置如下 <dependency> <groupId>org.mockito</groupId> <artifactId>mockit ...

  5. SpringBoot全局异常处理方式

    每个项目全局异常处理非常重要, 今天在处理项目架构的时候添加了一个全局异常处理. 大概三种异常情况: 一:在进入Controller之前,譬如请求一个不存在的地址,404错误. 二:在执行@Reque ...

  6. mysql插入中文数据报错 java.sql.SQLException: Incorrect string value: '\xE5\x90\x88\xE8\xAE\xA1' for column

    1.我们创建数据库的时候没有更改数据库的字符集为utf8. 在mysql工具中,右击数据库,->"改变数据库",->选择“基字符集”为utf-8; 2,数据库中表的字符 ...

  7. notepad++个人专注

    notepad++个人专注   快捷键 功能 1 Ctrl>>>>>>>>>>    Ctrl + b  匹配括号 Ctrl + d  选中 ...

  8. CASIO 5800P计算器游戏--猜数字游戏

    CASIO 5800P 计算器游戏--猜数字游戏原代码 我编的计算器小游戏--猜数字游戏 LbI I↙ "xxGUESS NUMBERxx xPROGRAMMER:JCHx -------- ...

  9. jQuery - 左右拖动分隔条

    1.实现效果: 2.代码: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http ...

  10. PostgreSQL锁级别及什么操作获取什么锁

    表级锁 大多数的表级锁是由内置的 SQL 命令获得的,但他们也可以通过锁命令来明确获取.可使用的表级锁包括: 访问共享(ACCESS SHARE) - SELECT 命令可在查询中引用的表上获得该锁. ...