clientWidth、offsetWidth等介紹

網頁可見區域寬: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 相對文檔的水平座標+垂直方向滾動的量文檔


IE,FireFox 差別以下:event

IE6.0、FF1.06+:容器

clientWidth = width + paddingcli

clientHeight = height + paddingscroll

offsetWidth = width + padding + bordermargin

offsetHeight = height + padding + borderdi

IE5.0/5.5:
clientWidth = width - border工作

clientHeight = height - borderdocument

offsetWidth = width

offsetHeight = height

(須要提一下:CSS中的margin屬性,與clientWidth、offsetWidth、clientHeight、offsetHeight均無關)

網頁可見區域寬: 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

相關文章
相關標籤/搜索