/**\r
* Returns the css height value for the first matched element.\r
* If used on document, returns the document's height (innerHeight)\r
- * If used on window, returns the viewports (window's) height\r
+ * If used on window, returns the viewport's (window) height\r
*\r
* @example $("#testdiv").height()\r
- * @result [ 200px ]\r
+ * @result "200px"
+ *
+ * @example $(document).height();
+ * @result 800
+ *
+ * @example $(window).height();
+ * @result 400\r
* \r
* @name height\r
- * @type jQuery\r
+ * @type Object\r
* @cat Dimensions\r
*/\r
$.fn.height = function() {\r
-\r
- if(this.get(0) == window) {\r
- if (self.innerHeight) return self.innerHeight; \r
- else if (document.documentElement && document.documentElement.clientHeight) return document.documentElement.clientHeight;\r
- else if (document.body) return document.body.clientHeight;\r
- }\r
+ if ( this.get(0) == window )
+ return self.innerHeight ||
+ jQuery.boxModel && document.documentElement.clientHeight ||\r
+ document.body.clientHeight;\r
\r
- if(this.get(0) == document) {\r
-\r
- var test1 = document.body.scrollHeight;\r
- var test2 = document.body.offsetHeight;\r
- if (test1 > test2) return document.body.scrollHeight;\r
- else return document.body.offsetHeight; \r
- }\r
+ if ( this.get(0) == document )\r
+ return Math.max( document.body.scrollHeight, document.body.offsetHeight );\r
\r
return this.css("height");\r
-}\r
+};
+\r
/**\r
* Returns the css width value for the first matched element.\r
* If used on document, returns the document's width (innerWidth)\r
- * If used on window, returns the viewports (window's) width\r
+ * If used on window, returns the viewport's (window) width\r
*\r
* @example $("#testdiv").width()\r
- * @result [ 200px ]\r
+ * @result "200px"
+ *
+ * @example $(document).width();
+ * @result 800
+ *
+ * @example $(window).width();
+ * @result 400\r
* \r
* @name width\r
- * @type jQuery\r
+ * @type Object\r
* @cat Dimensions\r
*/\r
$.fn.width = function() {\r
-\r
- if(this.get(0) == window) {\r
- if (self.innerWidth) return self.innerWidth; \r
- else if (document.documentElement && document.documentElement.clientWidth) return document.documentElement.clientWidth;\r
- else if (document.body) return document.body.clientWidth;\r
- }\r
+ if ( this.get(0) == window )
+ return self.innerWidth ||
+ jQuery.boxModel && document.documentElement.clientWidth ||\r
+ document.body.clientWidth;\r
\r
- if(this.get(0) == document) {\r
-\r
- var test1 = document.body.scrollWidth;\r
- var test2 = document.body.offsetWidth;\r
- if (test1 > test2) return document.body.scrollWidth;\r
- else return document.body.offsetWidth; \r
- }\r
+ if ( this.get(0) == document )\r
+ return Math.max( document.body.scrollWidth, document.body.offsetWidth );\r
\r
return this.css("width");\r
-}\r
+};
+\r
/**\r
* Returns the inner height value (without border) for the first matched element.\r
* If used on document, returns the document's height (innerHeight)\r
- * If used on window, returns the viewports (window's) height\r
+ * If used on window, returns the viewport's (window) height\r
*\r
* @example $("#testdiv").innerHeight()\r
- * @result [ 800px ]\r
+ * @result 800\r
* \r
* @name innerHeight\r
- * @type jQuery\r
+ * @type Number\r
* @cat Dimensions\r
*/\r
$.fn.innerHeight = function() {\r
- if(this.get(0) == window || this.get(0) == document) return this.height();\r
- return this.get(0).offsetHeight - (parseInt(this.css("borderTop")) + parseInt(this.css("borderBottom")));\r
-}\r
+ return this.get(0) == window || this.get(0) == document ?
+ this.height() :
+ this.get(0).offsetHeight - parseInt(this.css("borderTop") || 0) - parseInt(this.css("borderBottom") || 0);\r
+};
+\r
/**\r
* Returns the inner width value (without border) for the first matched element.\r
* If used on document, returns the document's Width (innerWidth)\r
- * If used on window, returns the viewports (window's) width\r
+ * If used on window, returns the viewport's (window) width\r
*\r
* @example $("#testdiv").innerWidth()\r
- * @result [ 1000px ]\r
+ * @result 1000\r
* \r
* @name innerWidth\r
- * @type jQuery\r
+ * @type Number\r
* @cat Dimensions\r
*/\r
$.fn.innerWidth = function() {\r
- if(this.get(0) == window || this.get(0) == document) return this.width();\r
- return this.get(0).offsetWidth - (parseInt(this.css("borderLeft")) + parseInt(this.css("borderRight")));\r
-}\r
+ return this.get(0) == window || this.get(0) == document ?
+ this.width() :
+ this.get(0).offsetWidth - parseInt(this.css("borderLeft") || 0) - parseInt(this.css("borderRight") || 0);\r
+};
+\r
/**\r
* Returns the outer height value (including border) for the first matched element.\r
* Cannot be used on document or window.\r
*\r
* @example $("#testdiv").outerHeight()\r
- * @result [ 1000px ]\r
+ * @result 1000\r
* \r
* @name outerHeight\r
- * @type jQuery\r
+ * @type Number\r
* @cat Dimensions\r
*/\r
$.fn.outerHeight = function() {\r
- if(this.get(0) == window || this.get(0) == document) return 0;\r
- return this.get(0).offsetHeight; \r
-}\r
+ return this.get(0) == window || this.get(0) == document ?
+ this.height() :
+ this.get(0).offsetHeight; \r
+};
+\r
/**\r
* Returns the outer width value (including border) for the first matched element.\r
* Cannot be used on document or window.\r
*\r
* @example $("#testdiv").outerWidth()\r
- * @result [ 1000px ]\r
+ * @result 1000\r
* \r
* @name outerWidth\r
- * @type jQuery\r
+ * @type Number\r
* @cat Dimensions\r
*/\r
$.fn.outerWidth = function() {\r
- if(this.get(0) == window || this.get(0) == document) return 0;\r
- return this.get(0).offsetWidth; \r
-}\r
+ return this.get(0) == window || this.get(0) == document ?
+ this.width() :
+ this.get(0).offsetWidth; \r
+};
+\r
/**\r
* Returns how many pixels the user has scrolled to the right (scrollLeft).\r
* Works on containers with overflow: auto and window/document.\r
*\r
* @example $("#testdiv").scrollLeft()\r
- * @result [ 100px ]\r
+ * @result 100\r
* \r
* @name scrollLeft\r
- * @type jQuery\r
+ * @type Number\r
* @cat Dimensions\r
*/\r
$.fn.scrollLeft = function() {\r
- if(this.get(0) == window || this.get(0) == document) {\r
- if (self.pageXOffset) return self.pageXOffset;\r
- else if (document.documentElement && document.documentElement.scrollLeft) return document.documentElement.scrollLeft;\r
- else if (document.body) return document.body.scrollLeft;\r
- }\r
+ if ( this.get(0) == window || this.get(0) == document )
+ return self.pageXOffset ||
+ jQuery.boxModel && document.documentElement.scrollLeft ||
+ document.body.scrollLeft;
+ \r
return this.get(0).scrollLeft;\r
-}\r
+};
+\r
/**\r
* Returns how many pixels the user has scrolled to the bottom (scrollTop).\r
* Works on containers with overflow: auto and window/document.\r
*\r
* @example $("#testdiv").scrollTop()\r
- * @result [ 100px ]\r
+ * @result 100\r
* \r
* @name scrollTop\r
- * @type jQuery\r
+ * @type Number\r
* @cat Dimensions\r
*/\r
$.fn.scrollTop = function() {\r
- if(this.get(0) == window || this.get(0) == document) {\r
- if (self.pageYOffset) return self.pageYOffset;\r
- else if (document.documentElement && document.documentElement.scrollTop) return document.documentElement.scrollTop;\r
- else if (document.body) return document.body.scrollTop;\r
- } \r
+ if ( this.get(0) == window || this.get(0) == document )
+ return self.pageYOffset ||
+ jQuery.boxModel && document.documentElement.scrollTop ||
+ document.body.scrollTop;
+\r
return this.get(0).scrollTop;\r
-}
\ No newline at end of file
+};\r
+\r
+/* Copyright (c) 2006 Brandon Aaron (http://brandonaaron.net)\r
+ * Dual licensed under the MIT (http://www.opensource.org/licenses/mit-license.php) \r
+ * and GPL (http://www.opensource.org/licenses/gpl-license.php) licenses.\r
+ */\r
+\r
+/**\r
+ * This returns an object with top, left, width, height, borderLeft,\r
+ * borderTop, marginLeft, marginTop, scrollLeft, scrollTop, \r
+ * pageXOffset, pageYOffset.\r
+ *\r
+ * The top and left values include the scroll offsets but the\r
+ * scrollLeft and scrollTop properties of the returned object\r
+ * are the combined scroll offets of the parent elements \r
+ * (not including the window scroll offsets). This is not the\r
+ * same as the element's scrollTop and scrollLeft.\r
+ * \r
+ * For accurate readings make sure to use pixel values.\r
+ *\r
+ * @name offset \r
+ * @type Object\r
+ * @cat Dimensions\r
+ * @author Brandon Aaron (brandon.aaron@gmail.com || http://brandonaaron.net)\r
+ */\r
+/**\r
+ * This returns an object with top, left, width, height, borderLeft,\r
+ * borderTop, marginLeft, marginTop, scrollLeft, scrollTop, \r
+ * pageXOffset, pageYOffset.\r
+ *\r
+ * The top and left values include the scroll offsets but the\r
+ * scrollLeft and scrollTop properties of the returned object\r
+ * are the combined scroll offets of the parent elements \r
+ * (not including the window scroll offsets). This is not the\r
+ * same as the element's scrollTop and scrollLeft.\r
+ * \r
+ * For accurate readings make sure to use pixel values.\r
+ *\r
+ * @name offset \r
+ * @type Object\r
+ * @param String refElement This is an expression. The offset returned will be relative to the first matched element.\r
+ * @cat Dimensions\r
+ * @author Brandon Aaron (brandon.aaron@gmail.com || http://brandonaaron.net)\r
+ */\r
+/**\r
+ * This returns an object with top, left, width, height, borderLeft,\r
+ * borderTop, marginLeft, marginTop, scrollLeft, scrollTop, \r
+ * pageXOffset, pageYOffset.\r
+ *\r
+ * The top and left values include the scroll offsets but the\r
+ * scrollLeft and scrollTop properties of the returned object\r
+ * are the combined scroll offets of the parent elements \r
+ * (not including the window scroll offsets). This is not the\r
+ * same as the element's scrollTop and scrollLeft.\r
+ * \r
+ * For accurate readings make sure to use pixel values.\r
+ *\r
+ * @name offset \r
+ * @type Object\r
+ * @param jQuery refElement The offset returned will be relative to the first matched element.\r
+ * @cat Dimensions\r
+ * @author Brandon Aaron (brandon.aaron@gmail.com || http://brandonaaron.net)\r
+ */\r
+/**\r
+ * This returns an object with top, left, width, height, borderLeft,\r
+ * borderTop, marginLeft, marginTop, scrollLeft, scrollTop, \r
+ * pageXOffset, pageYOffset.\r
+ *\r
+ * The top and left values include the scroll offsets but the\r
+ * scrollLeft and scrollTop properties of the returned object\r
+ * are the combined scroll offets of the parent elements \r
+ * (not including the window scroll offsets). This is not the\r
+ * same as the element's scrollTop and scrollLeft.\r
+ * \r
+ * For accurate readings make sure to use pixel values.\r
+ *\r
+ * @name offset \r
+ * @type Object\r
+ * @param HTMLElement refElement The offset returned will be relative to this element.\r
+ * @cat Dimensions\r
+ * @author Brandon Aaron (brandon.aaron@gmail.com || http://brandonaaron.net)\r
+ */\r
+$.fn.offset = function(refElem) {\r
+ if (!this[0]) throw '$.fn.offset requires an element.';\r
+ \r
+ refElem = (refElem) ? $(refElem)[0] : null;\r
+ var x = 0, y = 0, elm = this[0], parent = this[0], pos = null, borders = [0,0], isElm = true, sl = 0, st = 0;\r
+ do {\r
+ if (parent.tagName == 'BODY' || parent.tagName == 'HTML') {\r
+ // Safari and IE don't add margin for static and relative\r
+ if (($.browser.safari || $.browser.msie) && pos != 'absolute') {\r
+ x += parseInt($.css(parent, 'marginLeft')) || 0;\r
+ y += parseInt($.css(parent, 'marginTop')) || 0;\r
+ }\r
+ break;\r
+ }\r
+ \r
+ pos = $.css(parent, 'position');\r
+ border = [parseInt($.css(parent, 'borderLeftWidth')) || 0,\r
+ parseInt($.css(parent, 'borderTopWidth')) || 0];\r
+ sl = parent.scrollLeft;\r
+ st = parent.scrollTop;\r
+ \r
+ x += (parent.offsetLeft || 0) + border[0] - sl;\r
+ y += (parent.offsetTop || 0) + border[1] - st;\r
+ \r
+ // Safari and Opera include the border already for parents with position = absolute|relative\r
+ if (($.browser.safari || $.browser.opera) && !isElm && (pos == 'absolute' || pos == 'relative')) {\r
+ x -= border[0];\r
+ y -= border[1];\r
+ }\r
+ \r
+ parent = parent.offsetParent;\r
+ isElm = false;\r
+ } while(parent);\r
+ \r
+ if (refElem) {\r
+ var offset = $(refElem).offset();\r
+ x = x - offset.left;\r
+ y = y - offset.top;\r
+ sl = sl - offset.scrollLeft;\r
+ st = st - offset.scrollTop;\r
+ }\r
+ \r
+ return {\r
+ top: y,\r
+ left: x,\r
+ width: elm.offsetWidth,\r
+ height: elm.offsetHeight,\r
+ borderTop: parseInt($.css(elm, 'borderTopWidth')) || 0,\r
+ borderLeft: parseInt($.css(elm, 'borderLeftWidth')) || 0,\r
+ marginTop: parseInt($.css(elm, 'marginTopWidth')) || 0,\r
+ marginLeft: parseInt($.css(elm, 'marginLeftWidth')) || 0,\r
+ scrollTop: st,\r
+ scrollLeft: sl,\r
+ pageYOffset: window.pageYOffset || document.documentElement.scrollTop || document.body.scrollTop || 0,\r
+ pageXOffset: window.pageXOffset || document.documentElement.scrollLeft || document.body.scrollLeft || 0\r
+ };\r
+};
\ No newline at end of file