/* * Dual licensed under the MIT (http://www.opensource.org/licenses/mit-license.php) * and GPL (http://www.opensource.org/licenses/gpl-license.php) licenses. * * $LastChangedDate: 2007-03-04 20:15:11 -0600 (Sun, 04 Mar 2007) $ * $Rev: 1485 $ */ jQuery.fn._height = jQuery.fn.height; jQuery.fn._width = jQuery.fn.width; /** * If used on document, returns the document's height (innerHeight) * If used on window, returns the viewport's (window) height * See core docs on height() to see what happens when used on an element. * * @example $("#testdiv").height() * @result 200 * * @example $(document).height() * @result 800 * * @example $(window).height() * @result 400 * * @name height * @type Object * @cat Plugins/Dimensions */ jQuery.fn.height = function() { if ( this[0] == window ) return self.innerHeight || jQuery.boxModel && document.documentElement.clientHeight || document.body.clientHeight; if ( this[0] == document ) return Math.max( document.body.scrollHeight, document.body.offsetHeight ); return this._height(arguments[0]); }; /** * If used on document, returns the document's width (innerWidth) * If used on window, returns the viewport's (window) width * See core docs on height() to see what happens when used on an element. * * @example $("#testdiv").width() * @result 200 * * @example $(document).width() * @result 800 * * @example $(window).width() * @result 400 * * @name width * @type Object * @cat Plugins/Dimensions */ jQuery.fn.width = function() { if ( this[0] == window ) return self.innerWidth || jQuery.boxModel && document.documentElement.clientWidth || document.body.clientWidth; if ( this[0] == document ) return Math.max( document.body.scrollWidth, document.body.offsetWidth ); return this._width(arguments[0]); }; /** * Returns the inner height value (without border) for the first matched element. * If used on document, returns the document's height (innerHeight) * If used on window, returns the viewport's (window) height * * @example $("#testdiv").innerHeight() * @result 800 * * @name innerHeight * @type Number * @cat Plugins/Dimensions */ jQuery.fn.innerHeight = function() { return this[0] == window || this[0] == document ? this.height() : this.css('display') != 'none' ? this[0].offsetHeight - (parseInt(this.css("borderTopWidth")) || 0) - (parseInt(this.css("borderBottomWidth")) || 0) : this.height() + (parseInt(this.css("paddingTop")) || 0) + (parseInt(this.css("paddingBottom")) || 0); }; /** * Returns the inner width value (without border) for the first matched element. * If used on document, returns the document's Width (innerWidth) * If used on window, returns the viewport's (window) width * * @example $("#testdiv").innerWidth() * @result 1000 * * @name innerWidth * @type Number * @cat Plugins/Dimensions */ jQuery.fn.innerWidth = function() { return this[0] == window || this[0] == document ? this.width() : this.css('display') != 'none' ? this[0].offsetWidth - (parseInt(this.css("borderLeftWidth")) || 0) - (parseInt(this.css("borderRightWidth")) || 0) : this.height() + (parseInt(this.css("paddingLeft")) || 0) + (parseInt(this.css("paddingRight")) || 0); }; /** * Returns the outer height value (including border) for the first matched element. * Cannot be used on document or window. * * @example $("#testdiv").outerHeight() * @result 1000 * * @name outerHeight * @type Number * @cat Plugins/Dimensions */ jQuery.fn.outerHeight = function() { return this[0] == window || this[0] == document ? this.height() : this.css('display') != 'none' ? this[0].offsetHeight : this.height() + (parseInt(this.css("borderTopWidth")) || 0) + (parseInt(this.css("borderBottomWidth")) || 0) + (parseInt(this.css("paddingTop")) || 0) + (parseInt(this.css("paddingBottom")) || 0); }; /** * Returns the outer width value (including border) for the first matched element. * Cannot be used on document or window. * * @example $("#testdiv").outerWidth() * @result 1000 * * @name outerWidth * @type Number * @cat Plugins/Dimensions */ jQuery.fn.outerWidth = function() { return this[0] == window || this[0] == document ? this.width() : this.css('display') != 'none' ? this[0].offsetWidth : this.height() + (parseInt(this.css("borderLeftWidth")) || 0) + (parseInt(this.css("borderRightWidth")) || 0) + (parseInt(this.css("paddingLeft")) || 0) + (parseInt(this.css("paddingRight")) || 0); }; /** * Returns how many pixels the user has scrolled to the right (scrollLeft). * Works on containers with overflow: auto and window/document. * * @example $("#testdiv").scrollLeft() * @result 100 * * @name scrollLeft * @type Number * @cat Plugins/Dimensions */ jQuery.fn.scrollLeft = function() { if ( this[0] == window || this[0] == document ) return self.pageXOffset || jQuery.boxModel && document.documentElement.scrollLeft || document.body.scrollLeft; return this[0].scrollLeft; }; /** * Returns how many pixels the user has scrolled to the bottom (scrollTop). * Works on containers with overflow: auto and window/document. * * @example $("#testdiv").scrollTop() * @result 100 * * @name scrollTop * @type Number * @cat Plugins/Dimensions */ jQuery.fn.scrollTop = function() { if ( this[0] == window || this[0] == document ) return self.pageYOffset || jQuery.boxModel && document.documentElement.scrollTop || document.body.scrollTop; return this[0].scrollTop; }; /** * Returns the location of the element in pixels from the top left corner of the viewport. * * For accurate readings make sure to use pixel values for margins, borders and padding. * * @example $("#testdiv").offset() * @result { top: 100, left: 100, scrollTop: 10, scrollLeft: 10 } * * @example $("#testdiv").offset({ scroll: false }) * @result { top: 90, left: 90 } * * @example var offset = {} * $("#testdiv").offset({ scroll: false }, offset) * @result offset = { top: 90, left: 90 } * * @name offset * @param Object options A hash of options describing what should be included in the final calculations of the offset. * The options include: * margin: Should the margin of the element be included in the calculations? True by default. * If set to false the margin of the element is subtracted from the total offset. * border: Should the border of the element be included in the calculations? True by default. * If set to false the border of the element is subtracted from the total offset. * padding: Should the padding of the element be included in the calculations? False by default. * If set to true the padding of the element is added to the total offset. * scroll: Should the scroll offsets of the parent elements be included in the calculations? * True by default. When true, it adds the total scroll offsets of all parents to the * total offset and also adds two properties to the returned object, scrollTop and * scrollLeft. If set to false the scroll offsets of parent elements are ignored. * If scroll offsets are not needed, set to false to get a performance boost. * @param Object returnObject An object to store the return value in, so as not to break the chain. If passed in the * chain will not be broken and the result will be assigned to this object. * @type Object * @cat Plugins/Dimensions * @author Brandon Aaron (brandon.aaron@gmail.com || http://brandonaaron.net) */ jQuery.fn.offset = function(options, returnObject) { var x = 0, y = 0, elem = this[0], parent = this[0], op, sl = 0, st = 0, options = jQuery.extend({ margin: true, border: true, padding: false, scroll: true }, options || {}); do { x += parent.offsetLeft || 0; y += parent.offsetTop || 0; // Mozilla and IE do not add the border if (jQuery.browser.mozilla || jQuery.browser.msie) { // get borders var bt = parseInt(jQuery.css(parent, 'borderTopWidth')) || 0; var bl = parseInt(jQuery.css(parent, 'borderLeftWidth')) || 0; // add borders to offset x += bl; y += bt; // Mozilla removes the border if the parent has overflow property other than visible if (jQuery.browser.mozilla && parent != elem && jQuery.css(parent, 'overflow') != 'visible') { x += bl; y += bt; } } if (options.scroll) { // Need to get scroll offsets in-between offsetParents op = parent.offsetParent; do { sl += parent.scrollLeft || 0; st += parent.scrollTop || 0; parent = parent.parentNode; // Mozilla removes the border if the parent has overflow property other than visible if (jQuery.browser.mozilla && parent != elem && parent != op && jQuery.css(parent, 'overflow') != 'visible') { y += parseInt(jQuery.css(parent, 'borderTopWidth')) || 0; x += parseInt(jQuery.css(parent, 'borderLeftWidth')) || 0; } } while (parent != op); } else parent = parent.offsetParent; if (parent && (parent.tagName.toLowerCase() == 'body' || parent.tagName.toLowerCase() == 'html')) { // Safari doesn't add the body margin for elments positioned with static or relative if ((jQuery.browser.safari || (jQuery.browser.msie && jQuery.boxModel)) && jQuery.css(parent, 'position') != 'absolute') { x += parseInt(jQuery.css(op, 'marginLeft')) || 0; y += parseInt(jQuery.css(op, 'marginTop')) || 0; } break; // Exit the loop } } while (parent); if ( !options.margin) { x -= parseInt(jQuery.css(elem, 'marginLeft')) || 0; y -= parseInt(jQuery.css(elem, 'marginTop')) || 0; } // Safari and Opera do not add the border for the element if ( options.border && (jQuery.browser.safari || jQuery.browser.opera) ) { x += parseInt(jQuery.css(elem, 'borderLeftWidth')) || 0; y += parseInt(jQuery.css(elem, 'borderTopWidth')) || 0; } else if ( !options.border && !(jQuery.browser.safari || jQuery.browser.opera) ) { x -= parseInt(jQuery.css(elem, 'borderLeftWidth')) || 0; y -= parseInt(jQuery.css(elem, 'borderTopWidth')) || 0; } if ( options.padding ) { x += parseInt(jQuery.css(elem, 'paddingLeft')) || 0; y += parseInt(jQuery.css(elem, 'paddingTop')) || 0; } // Opera thinks offset is scroll offset for display: inline elements if (options.scroll && jQuery.browser.opera && jQuery.css(elem, 'display') == 'inline') { sl -= elem.scrollLeft || 0; st -= elem.scrollTop || 0; } var returnValue = options.scroll ? { top: y - st, left: x - sl, scrollTop: st, scrollLeft: sl } : { top: y, left: x }; if (returnObject) { jQuery.extend(returnObject, returnValue); return this; } else { return returnValue; } };