导读:简而言之,它们的概念如下:① offsetparent() 指的是元素的第一级拥有定位属性(absolute/relative/fixed)的父元素。② offsetLeft/offs...
简而言之,它们的概念如下:
① offsetparent() 指的是元素的第一级拥有定位属性(absolute/relative/fixed)的父元素。
② offsetLeft/offsetTop 元素boder外侧,到其offsetparent()的border内侧的偏移量。
③ offset() 返回{left:xx, top: yy}, 它表示元素对于文档的绝对偏移量。
④ position() 返回{left:xx, top: yy}, 它表示元素magrin外部,到其offsetparent()的border内侧的距离。
定义和用法
offsetParent() 获得被定位的最近祖先元素。
设置类名为 item-a 的 li 元素的最近定位父元素的背景色:
$('li.item-a').offsetParent().css('background-color', 'red');
详细说明
如果给定一个表示 DOM 元素集合的 jQuery 对象,.offsetParent() 方法允许我们搜索 DOM 树中元素的祖先,并构造一个由最近的定位祖先元素包围的 jQuery 对象。定位元素指的是,元素的 CSS position 属性设置为 relative、absolute 或 fixed。在为表演动画计算偏移或在页面上放置对象时,该信息会很有用处。
先看看这两个方法的定义。
offset():
获取匹配元素在当前视口的相对偏移。
返回的对象包含两个整形属性:top 和 left。此方法只对可见元素有效。
position():
获取匹配元素相对父元素的偏移。
返回的对象包含两个整形属性:top 和 left。为精确计算结果,请在补白、边框和填充属性上使用像素单位。此方法只对可见元素有效。