當(dāng)前位置:
首頁(yè) >
前端技术
> javascript
>内容正文
javascript
JS获取屏幕浏览器网页高度和宽度属性
生活随笔
收集整理的這篇文章主要介紹了
JS获取屏幕浏览器网页高度和宽度属性
小編覺(jué)得挺不錯(cuò)的,現(xiàn)在分享給大家,幫大家做個(gè)參考.
1 網(wǎng)頁(yè)可見(jiàn)區(qū)域?qū)?#xff1a;document.body.clientWidth
2 網(wǎng)頁(yè)可見(jiàn)區(qū)域高:document.body.clientHeight
3 網(wǎng)頁(yè)可見(jiàn)區(qū)域?qū)?#xff1a;document.body.offsetWidth (包括邊線的寬)
4 網(wǎng)頁(yè)可見(jiàn)區(qū)域高:document.body.offsetHeight (包括邊線的寬)
5 網(wǎng)頁(yè)正文全文寬:document.body.scrollWidth
6 網(wǎng)頁(yè)正文全文高:document.body.scrollHeight
7 網(wǎng)頁(yè)被卷去的高:document.body.scrollTop
8 網(wǎng)頁(yè)被卷去的左:document.body.scrollLeft
9 網(wǎng)頁(yè)正文部分上:window.screenTop
10 網(wǎng)頁(yè)正文部分左:window.screenLeft
11 屏幕分辨率的高:window.screen.height
12 屏幕分辨率的寬:window.screen.width
13 屏幕可用工作區(qū)高度:window.screen.availHeight
14 屏幕可用工作區(qū)寬度:window.screen.availWidth
15
16
17 HTML精確定位:scrollLeft,scrollWidth,clientWidth,offsetWidth
18 scrollHeight: 獲取對(duì)象的滾動(dòng)高度。
19 scrollLeft:設(shè)置或獲取位于對(duì)象左邊界和窗口中目前可見(jiàn)內(nèi)容的最左端之間的距離
20 scrollTop:設(shè)置或獲取位于對(duì)象最頂端和窗口中可見(jiàn)內(nèi)容的最頂端之間的距離
21 scrollWidth:獲取對(duì)象的滾動(dòng)寬度
22 offsetHeight:獲取對(duì)象相對(duì)于版面或由父坐標(biāo) offsetParent 屬性指定的父坐標(biāo)的高度
23 offsetLeft:獲取對(duì)象相對(duì)于版面或由 offsetParent 屬性指定的父坐標(biāo)的計(jì)算左側(cè)位置
24 offsetTop:獲取對(duì)象相對(duì)于版面或由 offsetTop 屬性指定的父坐標(biāo)的計(jì)算頂端位置
25 event.clientX 相對(duì)文檔的水平座標(biāo)
26 event.clientY 相對(duì)文檔的垂直座標(biāo)
27 event.offsetX 相對(duì)容器的水平坐標(biāo)
28 event.offsetY 相對(duì)容器的垂直坐標(biāo)
29 document.documentElement.scrollTop 垂直方向滾動(dòng)的值
30 event.clientX+document.documentElement.scrollTop 相對(duì)文檔的水平座標(biāo)+垂直方向滾動(dòng)的量
31
32 IE,FireFox 差異如下:
33
34 IE6.0、FF1.06+:
35
36 clientWidth = width + padding
37
38 clientHeight = height + padding
39
40 offsetWidth = width + padding + border
41
42 offsetHeight = height + padding + border
43
44 IE5.0/5.5:
45 clientWidth = width - border
46
47 clientHeight = height - border
48
49 offsetWidth = width
50
51 offsetHeight = height
52
53 (需要提一下:CSS中的margin屬性,與clientWidth、offsetWidth、clientHeight、offsetHeight均無(wú)關(guān))
?
轉(zhuǎn)載于:https://www.cnblogs.com/sirius-cg/archive/2012/05/18/2507599.html
總結(jié)
以上是生活随笔為你收集整理的JS获取屏幕浏览器网页高度和宽度属性的全部?jī)?nèi)容,希望文章能夠幫你解決所遇到的問(wèn)題。
- 上一篇: 排序算法概述
- 下一篇: 关于stm32启动文件的选择