Skip to content
Permalink
Browse files

offset is now a setter

  • Loading branch information
brandonaaron committed Sep 15, 2009
1 parent f55fb36 commit daffb954e397bd5d9f8e9aaedab6c0baa9609e1e
Showing with 248 additions and 83 deletions.
  1. +37 −6 src/offset.js
  2. +1 −1 test/data/offset/relative.html
  3. +1 −1 test/data/offset/static.html
  4. +209 −75 test/unit/offset.js
@@ -1,7 +1,12 @@
if ( "getBoundingClientRect" in document.documentElement ) {
jQuery.fn.offset = function() {
jQuery.fn.offset = function( options ) {
var elem = this[0];
if ( !elem || !elem.ownerDocument ) { return null; }
if ( options ) {
return this.each(function() {
jQuery.offset.setOffset( this, options );
});
}
if ( elem === elem.ownerDocument.body ) {
return jQuery.offset.bodyOffset( elem );
}
@@ -13,9 +18,14 @@ if ( "getBoundingClientRect" in document.documentElement ) {
return { top: top, left: left };
};
} else {
jQuery.fn.offset = function() {
jQuery.fn.offset = function( options ) {
var elem = this[0];
if ( !elem || !elem.ownerDocument ) { return null; }
if ( options ) {
return this.each(function() {
jQuery.offset.setOffset( this, options );
});
}
if ( elem === elem.ownerDocument.body ) {
return jQuery.offset.bodyOffset( elem );
}
@@ -25,18 +35,18 @@ if ( "getBoundingClientRect" in document.documentElement ) {
var offsetParent = elem.offsetParent, prevOffsetParent = elem,
doc = elem.ownerDocument, computedStyle, docElem = doc.documentElement,
body = doc.body, defaultView = doc.defaultView,
prevComputedStyle = defaultView.getComputedStyle(elem, null),
prevComputedStyle = defaultView.getComputedStyle( elem, null ),
top = elem.offsetTop, left = elem.offsetLeft;

while ( (elem = elem.parentNode) && elem !== body && elem !== docElem ) {
if ( jQuery.offset.supportsFixedPosition && prevComputedStyle.position === "fixed" ) { break; }

computedStyle = defaultView.getComputedStyle(elem, null);
top -= elem.scrollTop;
top -= elem.scrollTop;
left -= elem.scrollLeft;

if ( elem === offsetParent ) {
top += elem.offsetTop;
top += elem.offsetTop;
left += elem.offsetLeft;

if ( jQuery.offset.doesNotAddBorder && !(jQuery.offset.doesAddBorderForTableAndCells && /^t(able|d|h)$/i.test(elem.nodeName)) ) {
@@ -100,7 +110,7 @@ jQuery.offset = {
jQuery.offset.initialize = function(){};
},

bodyOffset: function(body) {
bodyOffset: function( body ) {
var top = body.offsetTop, left = body.offsetLeft;

jQuery.offset.initialize();
@@ -111,6 +121,27 @@ jQuery.offset = {
}

return { top: top, left: left };
},

setOffset: function( elem, options ) {
// set position first, in-case top/left are set even on static elem
if ( /static/.test( jQuery.curCSS( elem, 'position' ) ) ) {
elem.style.position = 'relative';
}
var curElem = jQuery( elem ),
curOffset = curElem.offset(),
curTop = parseInt( jQuery.curCSS( elem, 'top', true ), 10 ) || 0,
curLeft = parseInt( jQuery.curCSS( elem, 'left', true ), 10) || 0,
props = {
top: (options.top - curOffset.top) + curTop,
left: (options.left - curOffset.left) + curLeft
};

if ( 'using' in options ) {
options.using.call( elem, props );
} else {
curElem.css( props );
}
}
};

@@ -6,7 +6,7 @@
<title>relative</title>
<style type="text/css" media="screen">
body { margin: 1px; padding: 5px; }
div.relative { position: relative; margin: 1px; border: 2px solid #000; padding: 5px; width: 100px; height: 100px; background: #fff; overflow: hidden; }
div.relative { position: relative; top: 0; left: 0; margin: 1px; border: 2px solid #000; padding: 5px; width: 100px; height: 100px; background: #fff; overflow: hidden; }
#relative-2 { top: 20px; left: 20px; }
#marker { position: absolute; border: 2px solid #000; width: 50px; height: 50px; background: #ccc; }
</style>
@@ -6,7 +6,7 @@
<title>static</title>
<style type="text/css" media="screen">
body { margin: 1px; padding: 5px; }
div.static { position: static; margin: 1px; border: 2px solid #000; padding: 5px; width: 100px; height: 100px; background: #fff; overflow: hidden; }
div.static { position: static; top: 0; left: 0; margin: 1px; border: 2px solid #000; padding: 5px; width: 100px; height: 100px; background: #fff; overflow: hidden; }
#static-2 { top: 20px; left: 20px; }
#marker { position: absolute; border: 2px solid #000; width: 50px; height: 50px; background: #ccc; }
</style>

0 comments on commit daffb95

Please sign in to comment.
You can’t perform that action at this time.