position

---恢复内容开始--- 在jQuery中有两个获取元素位置的方法 offset() 和 position() 。 position() 方法是在1.2.6版本之后加入的，为什么要引入这个方法呢？这两个方法之间有什么异同？使用的时候应该注意哪些问题？什么时候使用 offset() ，什么时候又使用 position() 呢？ 先看看API对这这两个方法的定义： offset() ： 获取匹配元素在当前视口的相对偏移。 返回的对象包含两个整形属性：top 和 left。此方法只对可见元素有效。 position() ： 获取匹配元素相对父元素的偏移。 返回的对象包含两个整形属性： top 和 left 。为精确计算结果，请在补白、边框和填充属性上使用 像素单位 。此方法只对可见元素有效。 真的就这么简单吗？实践出真知。 先来看看在jQuery框架源码里面，是怎么获得 position() 的： //Get *real* offsetParent var offsetParent = this.offsetParent(), //Get correct offsets offset = this.offset(), parentOffset = /^body|html$/i.test(offsetParent[0].tagName) ? { top : 0, left : 0 } :

在jQuery中有两个获取元素位置的方法offset()和position()。position()方法是在1.2.6版本之后加入的，为什么要引 入这个方法呢？这两个方法之间有什么异同？使用的时候应该注意哪些问题？什么时候使用offset(),什么时候又使用position()呢？ 先看看API对这这两个方法的定义： offset(): 获取匹配元素在当前视口的相对偏移。 返回的对象包含两个整形属性：top 和 left。此方法只对可见元素有效。 position(): 获取匹配元素相对父元素的偏移。 返回的对象包含两个整形属性：top 和 left。为精确计算结果，请在补白、边框和填充属性上使用像素单位。此方法只对可见元素有效。 真的就这么简单吗？实践出真知。 先来看看在jQuery框架源码里面，是怎么获得position()的： //Get *real* offsetParent var offsetParent = this.offsetParent(), //Get correct offsets offset = this.offset(), parentOffset = /^body|html$/i.test(offsetParent[0].tagName) ? { top: 0, left: 0 } : offsetParent.offset(); /

在jQuery中有两个获取元素位置的方法offset()和position()。position()方法是在1.2.6版本之后加入的，为什么要引入这个方法呢？这两个方法之间有什么异同？使用的时候应该注意哪些问题？什么时候使用offset(),什么时候又使用position()呢？ 先看看API对这这两个方法的定义： offset(): 获取匹配元素在当前视口的相对偏移。 返回的对象包含两个整形属性：top 和 left。此方法只对可见元素有效。 position(): 获取匹配元素相对父元素的偏移。 返回的对象包含两个整形属性：top 和 left。为精确计算结果，请在补白、边框和填充属性上使用像素单位。此方法只对可见元素有效。 真的就这么简单吗？实践出真知。 先来看看在jQuery框架源码里面，是怎么获得position()的： //Get *real* offsetParent var offsetParent = this.offsetParent(), //Get correct offsets offset = this.offset(), parentOffset = /^body|html$/i.test(offsetParent[0].tagName) ? { top: 0, left: 0 } : offsetParent.offset(); //Subtract

在jQuery中有两个获取元素位置的方法offset()和position()。position()方法是在1.2.6版本之后加入的，为什么要引 入这个方法呢？这两个方法之间有什么异同？使用的时候应该注意哪些问题？什么时候使用offset(),什么时候又使用position()呢？ 先看看API对这这两个方法的定义： offset(): 获取匹配元素在当前视口的相对偏移。 返回的对象包含两个整形属性：top 和 left。此方法只对可见元素有效。 position(): 获取匹配元素相对父元素的偏移。 返回的对象包含两个整形属性：top 和 left。为精确计算结果，请在补白、边框和填充属性上使用像素单位。此方法只对可见元素有效。 真的就这么简单吗？实践出真知。 先来看看在jQuery框架源码里面，是怎么获得position()的： //Get *real* offsetParent var offsetParent = this.offsetParent(), //Get correct offsets offset = this.offset(), parentOffset = /^body|html$/i.test(offsetParent[0].tagName) ? { top: 0, left: 0 } : offsetParent.offset(); /

先看看这两个方法的定义。 offset(): 获取匹配元素在当前视口的相对偏移。 返回的对象包含两个整形属性：top 和 left。此方法只对可见元素有效。 position(): 获取匹配元素相对父元素的偏移。 返回的对象包含两个整形属性：top 和 left。为精确计算结果，请在补白、边框和填充属性上使用像素单位。此方法只对可见元素有效。 真的就这么简单吗？实践出真知。 先来看看在jquery框架源码里面，是怎么获得position()的： 1 // Get *real* offsetParent 2 var offsetParent = this.offsetParent(), 3 // Get correct offsets 4 offset = this.offset(), 5 parentOffset = /^body|html$/i.test(offsetParent[0].tagName) ? { top: 0, left: 0 } : offsetParent.offset(); 6 // Subtract element margins 7 // note: when an element has margin: auto the offsetLeft and marginLeft 8 // are the same in Safari causing

参考别人写得比较明白的，红色部分为重点吧： 使用jQuery获取元素位置时，我们会使用position()或offset()方法，两个方法都返回一个包含两个属性的对象－左边距和上边距，它们两个的不同点在于位置的相对点不同。 可以看看下边的图： 从图中我们可以大体看出两者的区别。 position()获取相对于它最近的具有相对位置(position:relative)的父级元素的距离，如果找不到这样的元素，则返回相对于浏览器的距离。 offset()始终返回相对于浏览器文档的距离，它会忽略外层元素 下边看个简单的例子，这里外层的div元素(position:relative)仅一个： <divid="outer"style="width:200px;position:relative;left:100px;"><divid="inner"style="position:absolute;left:50px;top:60px;"></div></div> //获取相对于最近的父级(position:relative)的位置var vposition = $("#inner").position(); alert(vposition.left);//输出：50 alert(vposition.top);//输出：60var voffset = $("#inner").offset();