Js中元素位置和鼠标位置的相关的一些属性

郝东的头像
郝东
226

Document.body.clientWidth;网页可见区域宽。width+左右padding。

Document.body.clientHeight;网页可见区域高。height + 上下padding。

document.body.offsetWidth;width + 左右padding + 左右boder

document.body.offsetHeight;height + 上下padding + 上下boder

document.body.scrollWidth;获取指定标签内容层的真实宽度(可视区域宽度+被隐藏区域宽度)。

document.body.scrollHeight;获取指定标签内容层的真实高度(可视区域高度+被隐藏区域高度)

document.body.scrollTop;当前元素 上边框 外边缘 到 最近的已定位父级(offsetParent) 上边框 内边缘的 距离。如果父级都没有定位,则分别是到body 顶部 和左边的距离

document.body.scrollLeft;:当前元素 左边框 外边缘 到 最近的已定位父级(offsetParent) 左边框 内边缘的距离。如果父级都没有定位,则分别是到body 顶部 和左边的距离

window.screenTop;window.screenLeft;返回窗口相对于屏幕的X和Y坐标

window.screen.height;属性声明了显示浏览器的屏幕的高度,以像素计。

window.screen.width;属性声明了显示浏览器的屏幕的宽度,以像素计。

window.screen.availHeight;属性声明了显示浏览器的屏幕的可用高度,以像素计。在 Windows 这样的操作系统中,这个可用高度不包括分配给半永久特性(如屏幕底部的任务栏)的垂直空间。

window.screen.availWidth;返回当前屏幕宽度(空白空间)

 

对象部分body/div:

offsetWidth (width+padding+border)当前对象的宽度。

offsetHeight:(Height+padding+border)当前对象的高度。

offsetLeft :当前对象到其上级层左边的距离。

offsetTop :当前对象到其上级层顶部边的距离。

scrollWidth:获取对象的滚动宽度 。

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

scrollLeft:设置或获取位于对象左边界和对象中目前可见内容的最左端之间的距离(width+padding为一体)

scrollTop:设置或获取位于对象最顶端和对象中可见内容的最顶端之间的距离;(height+padding为一体)

clientWidth: 获取对象可见内容的宽度,不包括滚动条,不包括边框;

clientHeight: 获取对象可见内容的高度,不包括滚动条,不包括边框;

clientLeft: 获取对象的border宽度

clientTop:获取对象的border高度

offsetParent :当前对象的上级层对象.

 

Event下的鼠标坐标;

pageX/Y :以页面左上角为参考点,表示当前触发点离页面左上角的水平和垂直距离。

clientX/Y :以可视区域左上角为参考点,表示当前触发点离可视区域左上角的水平和垂直距离。

offsetX/Y :以触发点所在dom的左上角为参考点,表示当前触发点离触发点所在dom的左上角的水平和垂直距离。

screenX/Y :以屏幕左上角为参考点,表示当前触发点离屏幕左上角的水平和垂直距离。

layerX/Y :当触发点所在的dom的position为relative或absolute时,则以dom的border外边框的左上角作为参考点,否则就以页面左上角为参考点(与pageX一致了)。

clientLeft/Top :元素左border的宽度和上border的高度。

clientWidth/Height :元素content+padding-滚动条的宽度或高度。

offsetWidth/Height :元素content+padding+border的宽度或高度。

scrollLeft/Top :元素水平、垂直滚动条切去的宽度或高度。

offsetParent :最近一个已进行CSS定位的祖先元素。

offsetTop/Left :元素border外边框的左上角离offsetParent的padding外边框的左上角的垂直、水平距离。若offsetParent为body或 html标签,且body的position不为relative或absolute时,offsetTop/Left为元素border外边框的左上角 离页面左上角的垂直、水平距离。若body的position为relative或absolute时,则为元素border外边框的左上角离 offsetParent的padding外边框的左上角的垂直、水平距离。

用户评论
评论列表