Jquery源码分析---DOM元素(中)
2010-09-14 13:36:33 来源:WEB开发网上面的代码①采用IE内部提供了特有的方法来找到相对body的Offset。这样做肯定是提高在IE中效率。②③④⑤⑥⑦⑧处是采用通用的处理方法来计算。对于一个元素的offset,加上其所有offsetParent的offset和border。这样就能计算出相对于body的offset。但是这样在scroll的情况下是行不通的。因为有scroll的卷起来的部分也被计算了进去,对于每个元素都要减去这一部分的大小。
⑧处我们可以看出如果有元素是fixed的position。说明其会随着documentElement.scroll而改变位置。因此加上documentElement.scroll。得出其正确的位置。
Jquery中的position方法是计算当前元素相对于其offsetParent的offset值。与dom元素的offset不一样的地方,它是建立在jquery.offset的基础之上,同时还不包括其自身的margin。对于box的模式来讲,是margin是元素的最外边,而不是border。
jQuery.fn.extend({position: function() {
var left = 0, top = 0, results;
if ( this[0] ) {
var offsetParent = this.offsetParent(),// Get *real* offsetParent
offset = this.offset(),// Get correct offsets
parentOffset = /^body|html$/i.test(offsetParent[0].tagName)
? { top: 0, left: 0 } : offsetParent.offset();
offset.top -= num( this, 'marginTop' );
offset.left -= num( this, 'marginLeft' );
parentOffset.top += num( offsetParent, 'borderTopWidth' );
parentOffset.left += num( offsetParent, 'borderLeftWidth' );
results = {
top: offset.top - parentOffset.top,
left: offset.left - parentOffset.left
};
}
return results;
},
更多精彩
赞助商链接