2024年6月11日发(作者:)

JS获取浏览器窗口大小 获取屏幕,浏览器,网页高度宽度

网页可见区域宽:Width

网页可见区域高:Height

网页可见区域宽:Width (包括边线的宽)

网页可见区域高:Height (包括边线的宽)

网页正文全文宽:Width

网页正文全文高:Height

网页被卷去的高:Top

网页被卷去的左:Left

网页正文部分上:Top

网页正文部分左:Left

屏幕分辨率的高:

屏幕分辨率的宽:

屏幕可用工作区高度:eight

屏幕可用工作区宽度:idth

HTML精确定位:scrollLeft,scrollWidth,clientWidth,offsetWidth

scrollHeight: 获取对象的滚动高度。

scrollLeft:设置或获取位于对象左边界和窗口中目前可见内容的最左端之间的

距离

scrollTop:设置或获取位于对象最顶端和窗口中可见内容的最顶端之间的距离

scrollWidth:获取对象的滚动宽度

offsetHeight:获取对象相对于版面或由父坐标 offsetParent 属性指定的父坐

标的高度

offsetLeft:获取对象相对于版面或由 offsetParent 属性指定的父坐标的计算

左侧位置

offsetTop:获取对象相对于版面或由 offsetTop 属性指定的父坐标的计算顶端

位置

X 相对文档的水平座标

Y 相对文档的垂直座标

X 相对容器的水平坐标

Y 相对容器的垂直坐标

Top 垂直方向滚动的值

X+Top 相对文档的水平座标+

垂直方向滚动的量

IE,FireFox 差异如下:

IE6.0、FF1.06+:

clientWidth = width + padding

clientHeight = height + padding

offsetWidth = width + padding + border

offsetHeight = height + padding + border

IE5.0/5.5:

clientWidth = width - border

clientHeight = height - border

offsetWidth = width

offsetHeight = height

(需要提一下:CSS中的margin属性,与clientWidth、offsetWidth、

clientHeight、offsetHeight均无关)

网页可见区域宽: Width

网页可见区域高: Height

网页可见区域宽: Width (包括边线的宽)

网页可见区域高: Height (包括边线的高)

网页正文全文宽: Width

网页正文全文高: Height

网页被卷去的高: Top

网页被卷去的左: Left

网页正文部分上: Top

网页正文部分左: Left

屏幕分辨率的高:

屏幕分辨率的宽:

屏幕可用工作区高度: eight

屏幕可用工作区宽度: idth

-------------------

技术要点

本节代码主要使用了Document对象关于窗口的一些属性,这些属性的主要功能

和用法如下。

要得到窗口的尺寸,对于不同的浏览器,需要使用不同的属性和方法:若要检测

窗口的真实尺寸,在Netscape下需要使用Window的属性;在IE下需要深入

Document内部对body进行检测;在DOM环境下,若要得到窗口的尺寸,需要注

意根元素的尺寸,而不是元素。

Window对象的innerWidth属性包含当前窗口的内部宽度。Window对象的

innerHeight属性包含当前窗口的内部高度。