原生js的offset***方法
c.offsetLeft 和 c.offsetTop
一般指当前元素的CSS边框相对于其offsetParent的X和Y坐标
c.offsetHeight 和 c.offsetWidth
当前元素及其所有内容的高度,宽度。
c.offsetParent
大多数元素都的都是指
<body>
参考《javascript权威指南 第六版》第892页
var c = document.getElementsByName("div")[0];c.offsetLeft
c.offsetTop
c.offsetParent
c.offsetHeight
c.offsetWidth
Jquery offset()方法
Jquery已经提供了该方法:
let offset = $(".class").offset()
返回值offset是一个对象:
{top:100left:100
}
表示从当前元素到屏幕边界的距离,单位是px.
用途
在实现屏幕坐标系时很有用,如下图:每个交叉点要可点,并且整个网格可以拖动到屏幕不同地方,并且要视频不同分辨率的屏幕
参考:
offsetLeft,Left,clientLeft的区别
Box Dimensions
HTMLElement.offsetLeft