library-mirrors/jquery
1
0
Fork 0
mirror of https://github.com/jquery/jquery.git synced 2024-11-23 02:54:22 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

Fix #11542. document.body should not be special in .offset() and document.documentElement is the default element.offsetParent. Close gh-899.

Browse Source
This commit is contained in:
Daniel Gálvez 2012-08-19 21:53:09 +02:00 committed by Dave Methvin
parent 69e2f068fe
commit b398a68333
3 changed files with 18 additions and 36 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

36
src/offset.js
View File

@ -1,5 +1,3 @@
var rroot = /^(?:body|html)$/i;
jQuery.fn.offset = function( options ) { jQuery.fn.offset = function( options ) {
if ( arguments.length ) { if ( arguments.length ) {
return options === undefined ? return options === undefined ?
@ -9,7 +7,7 @@ jQuery.fn.offset = function( options ) {
}); });
} }
var docElem, body, win, clientTop, clientLeft, scrollTop, scrollLeft, var docElem, win,
box = { top: 0, left: 0 }, box = { top: 0, left: 0 },
elem = this[ 0 ], elem = this[ 0 ],
doc = elem && elem.ownerDocument; doc = elem && elem.ownerDocument;
@ -18,10 +16,6 @@ jQuery.fn.offset = function( options ) {
return; return;
} }
if ( (body = doc.body) === elem ) {
return jQuery.offset.bodyOffset( elem );
}
docElem = doc.documentElement; docElem = doc.documentElement;
// Make sure it's not a disconnected DOM node // Make sure it's not a disconnected DOM node
@ -35,30 +29,14 @@ jQuery.fn.offset = function( options ) {
box = elem.getBoundingClientRect(); box = elem.getBoundingClientRect();
} }
win = getWindow( doc ); win = getWindow( doc );
clientTop = docElem.clientTop || body.clientTop || 0;
clientLeft = docElem.clientLeft || body.clientLeft || 0;
scrollTop = win.pageYOffset || docElem.scrollTop;
scrollLeft = win.pageXOffset || docElem.scrollLeft;
return { return {
top: box.top + scrollTop - clientTop, top: box.top + ( win.pageYOffset || docElem.scrollTop ) - ( docElem.clientTop || 0 ),
left: box.left + scrollLeft - clientLeft left: box.left + ( win.pageXOffset || docElem.scrollLeft ) - ( docElem.clientLeft || 0 )
}; };
}; };
jQuery.offset = { jQuery.offset = {
bodyOffset: function( body ) {
var top = body.offsetTop,
left = body.offsetLeft;
if ( jQuery.support.doesNotIncludeMarginInBodyOffset ) {
top += parseFloat( jQuery.css(body, "marginTop") ) || 0;
left += parseFloat( jQuery.css(body, "marginLeft") ) || 0;
}
return { top: top, left: left };
},
setOffset: function( elem, options, i ) { setOffset: function( elem, options, i ) {
var position = jQuery.css( elem, "position" ); var position = jQuery.css( elem, "position" );
@ -125,7 +103,7 @@ jQuery.fn.extend({
// Get correct offsets // Get correct offsets
offset = this.offset(); offset = this.offset();
if ( !rroot.test( offsetParent[ 0 ].nodeName ) ) { if ( !jQuery.nodeName( offsetParent[ 0 ], "html" ) ) {
parentOffset = offsetParent.offset(); parentOffset = offsetParent.offset();
} }
@ -145,11 +123,11 @@ jQuery.fn.extend({
offsetParent: function() { offsetParent: function() {
return this.map(function() { return this.map(function() {
var offsetParent = this.offsetParent || document.body; var offsetParent = this.offsetParent || document.documentElement;
while ( offsetParent && (!rroot.test(offsetParent.nodeName) && jQuery.css(offsetParent, "position") === "static") ) { while ( offsetParent && ( !jQuery.nodeName( offsetParent, "html" ) && jQuery.css( offsetParent, "position") === "static" ) ) {
offsetParent = offsetParent.offsetParent; offsetParent = offsetParent.offsetParent;
} }
return offsetParent || document.body; return offsetParent || document.documentElement;
}); });
} }
}); });

4
test/data/offset/body.html
View File

@ -5,8 +5,9 @@
<meta http-equiv="Content-type" content="text/html; charset=utf-8"> <meta http-equiv="Content-type" content="text/html; charset=utf-8">
<title>body</title> <title>body</title>
<style type="text/css" media="screen"> <style type="text/css" media="screen">
body { margin: 1px; padding: 5px; } body { margin: 1px; padding: 5px; position: relative }
#marker { position: absolute; border: 2px solid #000; width: 50px; height: 50px; background: #ccc; } #marker { position: absolute; border: 2px solid #000; width: 50px; height: 50px; background: #ccc; }
#firstElement { width: 50px; height: 50px; background: green; }
</style> </style>
<script src="../../../dist/jquery.js"></script> <script src="../../../dist/jquery.js"></script>
<script type="text/javascript" charset="utf-8"> <script type="text/javascript" charset="utf-8">
@ -19,6 +20,7 @@
</script> </script>
</head> </head>
<body> <body>
<div id="firstElement"></div>
<div id="marker"></div> <div id="marker"></div>
</body> </body>
</html> </html>

14
test/unit/offset.js
View File

@ -452,10 +452,12 @@ testIframe("offset/scroll", "scroll", function( $, win ) {
}); });
testIframe("offset/body", "body", function( $ ) { testIframe("offset/body", "body", function( $ ) {
expect(2); expect(4);
equal( $("body").offset().top, 1, "jQuery('#body').offset().top" ); equal( $("body").offset().top, 1, "jQuery('#body').offset().top" );
equal( $("body").offset().left, 1, "jQuery('#body').offset().left" ); equal( $("body").offset().left, 1, "jQuery('#body').offset().left" );
equal( $("#firstElement").position().left, 5, "$('#firstElement').position().left" );
equal( $("#firstElement").position().top, 5, "$('#firstElement').position().top" );
}); });
test("chaining", function() { test("chaining", function() {
@ -471,15 +473,15 @@ test("offsetParent", function(){
var body = jQuery("body").offsetParent(); var body = jQuery("body").offsetParent();
equal( body.length, 1, "Only one offsetParent found." ); equal( body.length, 1, "Only one offsetParent found." );
equal( body[0], document.body, "The body is its own offsetParent." ); equal( body[0], document.documentElement, "The html element is the offsetParent of the body." );
var header = jQuery("#qunit-header").offsetParent(); var header = jQuery("#qunit-header").offsetParent();
equal( header.length, 1, "Only one offsetParent found." ); equal( header.length, 1, "Only one offsetParent found." );
equal( header[0], document.body, "The body is the offsetParent." ); equal( header[0], document.documentElement, "The html element is the offsetParent of the body." );
var div = jQuery("#nothiddendivchild").offsetParent(); var div = jQuery("#nothiddendivchild").offsetParent();
equal( div.length, 1, "Only one offsetParent found." ); equal( div.length, 1, "Only one offsetParent found." );
equal( div[0], document.body, "The body is the offsetParent." ); equal( div[0], document.documentElement, "The html element is the offsetParent of the body." );
jQuery("#nothiddendiv").css("position", "relative"); jQuery("#nothiddendiv").css("position", "relative");
@ -489,11 +491,11 @@ test("offsetParent", function(){
div = jQuery("body, #nothiddendivchild").offsetParent(); div = jQuery("body, #nothiddendivchild").offsetParent();
equal( div.length, 2, "Two offsetParent found." ); equal( div.length, 2, "Two offsetParent found." );
equal( div[0], document.body, "The body is the offsetParent." ); equal( div[0], document.documentElement, "The html element is the offsetParent of the body." );
equal( div[1], jQuery("#nothiddendiv")[0], "The div is the offsetParent." ); equal( div[1], jQuery("#nothiddendiv")[0], "The div is the offsetParent." );
var area = jQuery("#imgmap area").offsetParent(); var area = jQuery("#imgmap area").offsetParent();
equal( area[0], document.body, "The body is the offsetParent." ); equal( area[0], document.documentElement, "The html element is the offsetParent of the body." );
}); });
test("fractions (see #7730 and #7885)", function() { test("fractions (see #7730 and #7885)", function() {