src/offset.js

   1 define([
   2         "./core",
   3         "./core/access",
   4         "./var/document",
   5         "./var/documentElement",
   6         "./css/var/rnumnonpx",
   7         "./css/curCSS",
   8         "./css/addGetHookIf",
   9         "./css/support",
  10
  11         "./core/init",
  12         "./css",
  13         "./selector" // contains
  14 ], function( jQuery, access, document, documentElement, rnumnonpx, curCSS, addGetHookIf, support ) {
  15
  16 /**
  17  * Gets a window from an element
  18  */
  19 function getWindow( elem ) {
  20         return jQuery.isWindow( elem ) ? elem : elem.nodeType === 9 && elem.defaultView;
  21 }
  22
  23 jQuery.offset = {
  24         setOffset: function( elem, options, i ) {
  25                 var curPosition, curLeft, curCSSTop, curTop, curOffset, curCSSLeft, calculatePosition,
  26                         position = jQuery.css( elem, "position" ),
  27                         curElem = jQuery( elem ),
  28                         props = {};
  29
  30                 // Set position first, in-case top/left are set even on static elem
  31                 if ( position === "static" ) {
  32                         elem.style.position = "relative";
  33                 }
  34
  35                 curOffset = curElem.offset();
  36                 curCSSTop = jQuery.css( elem, "top" );
  37                 curCSSLeft = jQuery.css( elem, "left" );
  38                 calculatePosition = ( position === "absolute" || position === "fixed" ) &&
  39                         ( curCSSTop + curCSSLeft ).indexOf("auto") > -1;
  40
  41                 // Need to be able to calculate position if either
  42                 // top or left is auto and position is either absolute or fixed
  43                 if ( calculatePosition ) {
  44                         curPosition = curElem.position();
  45                         curTop = curPosition.top;
  46                         curLeft = curPosition.left;
  47
  48                 } else {
  49                         curTop = parseFloat( curCSSTop ) || 0;
  50                         curLeft = parseFloat( curCSSLeft ) || 0;
  51                 }
  52
  53                 if ( jQuery.isFunction( options ) ) {
  54
  55                         // Use jQuery.extend here to allow modification of coordinates argument (gh-1848)
  56                         options = options.call( elem, i, jQuery.extend( {}, curOffset ) );
  57                 }
  58
  59                 if ( options.top != null ) {
  60                         props.top = ( options.top - curOffset.top ) + curTop;
  61                 }
  62                 if ( options.left != null ) {
  63                         props.left = ( options.left - curOffset.left ) + curLeft;
  64                 }
  65
  66                 if ( "using" in options ) {
  67                         options.using.call( elem, props );
  68
  69                 } else {
  70                         curElem.css( props );
  71                 }
  72         }
  73 };
  74
  75 jQuery.fn.extend({
  76         offset: function( options ) {
  77                 // Preserve chaining for setter
  78                 if ( arguments.length ) {
  79                         return options === undefined ?
  80                                 this :
  81                                 this.each(function( i ) {
  82                                         jQuery.offset.setOffset( this, options, i );
  83                                 });
  84                 }
  85
  86                 var docElem, win, rect, doc,
  87                         elem = this[ 0 ];
  88
  89                 if ( !elem ) {
  90                         return;
  91                 }
  92
  93                 rect = elem.getBoundingClientRect();
  94
  95                 // Make sure element is not hidden (display: none) or disconnected
  96                 if ( rect.width || rect.height || elem.getClientRects().length ) {
  97                         doc = elem.ownerDocument;
  98                         win = getWindow( doc );
  99                         docElem = doc.documentElement;
 100
 101                         return {
 102                                 top: rect.top + win.pageYOffset - docElem.clientTop,
 103                                 left: rect.left + win.pageXOffset - docElem.clientLeft
 104                         };
 105                 }
 106         },
 107
 108         position: function() {
 109                 if ( !this[ 0 ] ) {
 110                         return;
 111                 }
 112
 113                 var offsetParent, offset,
 114                         elem = this[ 0 ],
 115                         parentOffset = { top: 0, left: 0 };
 116
 117                 // Fixed elements are offset from window (parentOffset = {top:0, left: 0},
 118                 // because it is its only offset parent
 119                 if ( jQuery.css( elem, "position" ) === "fixed" ) {
 120                         // Assume getBoundingClientRect is there when computed position is fixed
 121                         offset = elem.getBoundingClientRect();
 122
 123                 } else {
 124                         // Get *real* offsetParent
 125                         offsetParent = this.offsetParent();
 126
 127                         // Get correct offsets
 128                         offset = this.offset();
 129                         if ( !jQuery.nodeName( offsetParent[ 0 ], "html" ) ) {
 130                                 parentOffset = offsetParent.offset();
 131                         }
 132
 133                         // Add offsetParent borders
 134                         parentOffset.top += jQuery.css( offsetParent[ 0 ], "borderTopWidth", true );
 135                         parentOffset.left += jQuery.css( offsetParent[ 0 ], "borderLeftWidth", true );
 136                 }
 137
 138                 // Subtract parent offsets and element margins
 139                 return {
 140                         top: offset.top - parentOffset.top - jQuery.css( elem, "marginTop", true ),
 141                         left: offset.left - parentOffset.left - jQuery.css( elem, "marginLeft", true )
 142                 };
 143         },
 144
 145         // This method will return documentElement in the following cases:
 146         // 1) For the element inside the iframe without offsetParent, this method will return
 147         //    documentElement of the parent window
 148         // 2) For the hidden or detached element
 149         // 3) For body or html element, i.e. in case of the html node - it will return itself
 150         //
 151         // but those exceptions were never presented as a real life use-cases
 152         // and might be considered as more preferable results.
 153         //
 154         // This logic, however, is not guaranteed and can change at any point in the future
 155         offsetParent: function() {
 156                 return this.map(function() {
 157                         var offsetParent = this.offsetParent;
 158
 159                         while ( offsetParent && jQuery.css( offsetParent, "position" ) === "static" ) {
 160                                 offsetParent = offsetParent.offsetParent;
 161                         }
 162
 163                         return offsetParent || documentElement;
 164                 });
 165         }
 166 });
 167
 168 // Create scrollLeft and scrollTop methods
 169 jQuery.each( { scrollLeft: "pageXOffset", scrollTop: "pageYOffset" }, function( method, prop ) {
 170         var top = "pageYOffset" === prop;
 171
 172         jQuery.fn[ method ] = function( val ) {
 173                 return access( this, function( elem, method, val ) {
 174                         var win = getWindow( elem );
 175
 176                         if ( val === undefined ) {
 177                                 return win ? win[ prop ] : elem[ method ];
 178                         }
 179
 180                         if ( win ) {
 181                                 win.scrollTo(
 182                                         !top ? val : win.pageXOffset,
 183                                         top ? val : win.pageYOffset
 184                                 );
 185
 186                         } else {
 187                                 elem[ method ] = val;
 188                         }
 189                 }, method, val, arguments.length, null );
 190         };
 191 });
 192
 193 // Support: Safari<7+, Chrome<37+
 194 // Add the top/left cssHooks using jQuery.fn.position
 195 // Webkit bug: https://bugs.webkit.org/show_bug.cgi?id=29084
 196 // Blink bug: https://code.google.com/p/chromium/issues/detail?id=229280
 197 // getComputedStyle returns percent when specified for top/left/bottom/right;
 198 // rather than make the css module depend on the offset module, just check for it here
 199 jQuery.each( [ "top", "left" ], function( i, prop ) {
 200         jQuery.cssHooks[ prop ] = addGetHookIf( support.pixelPosition,
 201                 function( elem, computed ) {
 202                         if ( computed ) {
 203                                 computed = curCSS( elem, prop );
 204                                 // If curCSS returns percentage, fallback to offset
 205                                 return rnumnonpx.test( computed ) ?
 206                                         jQuery( elem ).position()[ prop ] + "px" :
 207                                         computed;
 208                         }
 209                 }
 210         );
 211 });
 212
 213 return jQuery;
 214 });