Many resources are needed to download a project. Please understand that we have to compensate our server costs. Thank you in advance. Project price only 1 $
You can buy this project and download/modify it how often you want.
/* Copyright (c) 2007 Paul Bakaus ([email protected]) and Brandon Aaron ([email protected] || http://brandonaaron.net)
* 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-06-22 04:38:37 +0200 (Fr, 22 Jun 2007) $
* $Rev: 2141 $
*
* Version: 1.0b2
*/
(function($){
// store a copy of the core height and width methods
var height = $.fn.height,
width = $.fn.width;
$.fn.extend({
/**
* 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
*/
height: function() {
if ( this[0] == window )
return self.innerHeight ||
$.boxModel && document.documentElement.clientHeight ||
document.body.clientHeight;
if ( this[0] == document )
return Math.max( document.body.scrollHeight, document.body.offsetHeight );
return height.apply(this, arguments);
},
/**
* 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
*/
width: function() {
if ( this[0] == window )
return self.innerWidth ||
$.boxModel && document.documentElement.clientWidth ||
document.body.clientWidth;
if ( this[0] == document )
return Math.max( document.body.scrollWidth, document.body.offsetWidth );
return width.apply(this, arguments);
},
/**
* 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
*/
innerHeight: function() {
return this[0] == window || this[0] == document ?
this.height() :
this.is(':visible') ?
this[0].offsetHeight - num(this, 'borderTopWidth') - num(this, 'borderBottomWidth') :
this.height() + num(this, 'paddingTop') + num(this, 'paddingBottom');
},
/**
* 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
*/
innerWidth: function() {
return this[0] == window || this[0] == document ?
this.width() :
this.is(':visible') ?
this[0].offsetWidth - num(this, 'borderLeftWidth') - num(this, 'borderRightWidth') :
this.width() + num(this, 'paddingLeft') + num(this, 'paddingRight');
},
/**
* 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
*/
outerHeight: function() {
return this[0] == window || this[0] == document ?
this.height() :
this.is(':visible') ?
this[0].offsetHeight :
this.height() + num(this,'borderTopWidth') + num(this, 'borderBottomWidth') + num(this, 'paddingTop') + num(this, 'paddingBottom');
},
/**
* Returns the outer width 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
*/
outerWidth: function() {
return this[0] == window || this[0] == document ?
this.width() :
this.is(':visible') ?
this[0].offsetWidth :
this.width() + num(this, 'borderLeftWidth') + num(this, 'borderRightWidth') + num(this, 'paddingLeft') + num(this, 'paddingRight');
},
/**
* 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
*/
/**
* Sets the scrollLeft property and continues the chain.
* Works on containers with overflow: auto and window/document.
*
* @example $("#testdiv").scrollLeft(10).scrollLeft()
* @result 10
*
* @name scrollLeft
* @param Number value A positive number representing the desired scrollLeft.
* @type jQuery
* @cat Plugins/Dimensions
*/
scrollLeft: function(val) {
if ( val != undefined )
// set the scroll left
return this.each(function() {
if (this == window || this == document)
window.scrollTo( val, $(window).scrollTop() );
else
this.scrollLeft = val;
});
// return the scroll left offest in pixels
if ( this[0] == window || this[0] == document )
return self.pageXOffset ||
$.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
*/
/**
* Sets the scrollTop property and continues the chain.
* Works on containers with overflow: auto and window/document.
*
* @example $("#testdiv").scrollTop(10).scrollTop()
* @result 10
*
* @name scrollTop
* @param Number value A positive number representing the desired scrollTop.
* @type jQuery
* @cat Plugins/Dimensions
*/
scrollTop: function(val) {
if ( val != undefined )
// set the scroll top
return this.each(function() {
if (this == window || this == document)
window.scrollTo( $(window).scrollLeft(), val );
else
this.scrollTop = val;
});
// return the scroll top offset in pixels
if ( this[0] == window || this[0] == document )
return self.pageYOffset ||
$.boxModel && document.documentElement.scrollTop ||
document.body.scrollTop;
return this[0].scrollTop;
},
/**
* Returns the top and left positioned offset in pixels.
* The positioned offset is the offset between a positioned
* parent and the element itself.
*
* @example $("#testdiv").position()
* @result { top: 100, left: 100 }
*
* @name position
* @param Map options Optional settings to configure the way the offset is calculated.
* @option Boolean margin Should the margin of the element be included in the calculations? False by default.
* @option Boolean border Should the border of the element be included in the calculations? False by default.
* @option Boolean padding Should the padding of the element be included in the calculations? False by default.
* @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
*/
position: function(options, returnObject) {
var elem = this[0], parent = elem.parentNode, op = elem.offsetParent,
options = $.extend({ margin: false, border: false, padding: false, scroll: false }, options || {}),
x = elem.offsetLeft,
y = elem.offsetTop,
sl = elem.scrollLeft,
st = elem.scrollTop;
// Mozilla and IE do not add the border
if ($.browser.mozilla || $.browser.msie) {
// add borders to offset
x += num(elem, 'borderLeftWidth');
y += num(elem, 'borderTopWidth');
}
if ($.browser.mozilla) {
do {
// Mozilla does not add the border for a parent that has overflow set to anything but visible
if ($.browser.mozilla && parent != elem && $.css(parent, 'overflow') != 'visible') {
x += num(parent, 'borderLeftWidth');
y += num(parent, 'borderTopWidth');
}
if (parent == op) break; // break if we are already at the offestParent
} while ((parent = parent.parentNode) && (parent.tagName.toLowerCase() != 'body' || parent.tagName.toLowerCase() != 'html'));
}
var returnValue = handleOffsetReturn(elem, options, x, y, sl, st);
if (returnObject) { $.extend(returnObject, returnValue); return this; }
else { return returnValue; }
},
/**
* 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.
*
* Known issues:
* - Issue: A div positioned relative or static without any content before it and its parent will report an offsetTop of 0 in Safari
* Workaround: Place content before the relative div ... and set height and width to 0 and overflow to hidden
*
* @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 Map options Optional settings to configure the way the offset is calculated.
* @option Boolean margin Should the margin of the element be included in the calculations? True by default.
* @option Boolean border Should the border of the element be included in the calculations? False by default.
* @option Boolean padding Should the padding of the element be included in the calculations? False by default.
* @option Boolean scroll Should the scroll offsets of the parent elements be included in the calculations? True by default.
* When true it adds the totla scroll offets of all parents to the total offset and also adds two properties
* to the returned object, scrollTop and scrollLeft.
* @options Boolean lite Will use offsetLite instead of offset when set to true. False by default.
* @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
*/
offset: function(options, returnObject) {
var x = 0, y = 0, sl = 0, st = 0,
elem = this[0], parent = this[0], op, parPos, elemPos = $.css(elem, 'position'),
mo = $.browser.mozilla, ie = $.browser.msie, sf = $.browser.safari, oa = $.browser.opera,
absparent = false, relparent = false,
options = $.extend({ margin: true, border: false, padding: false, scroll: true, lite: false }, options || {});
// Use offsetLite if lite option is true
if (options.lite) return this.offsetLite(options, returnObject);
if (elem.tagName.toLowerCase() == 'body') {
// Safari is the only one to get offsetLeft and offsetTop properties of the body "correct"
// Except they all mess up when the body is positioned absolute or relative
x = elem.offsetLeft;
y = elem.offsetTop;
// Mozilla ignores margin and subtracts border from body element
if (mo) {
x += num(elem, 'marginLeft') + (num(elem, 'borderLeftWidth')*2);
y += num(elem, 'marginTop') + (num(elem, 'borderTopWidth') *2);
} else
// Opera ignores margin
if (oa) {
x += num(elem, 'marginLeft');
y += num(elem, 'marginTop');
} else
// IE does not add the border in Standards Mode
if (ie && jQuery.boxModel) {
x += num(elem, 'borderLeftWidth');
y += num(elem, 'borderTopWidth');
}
} else {
do {
parPos = $.css(parent, 'position');
x += parent.offsetLeft;
y += parent.offsetTop;
// Mozilla and IE do not add the border
if (mo || ie) {
// add borders to offset
x += num(parent, 'borderLeftWidth');
y += num(parent, 'borderTopWidth');
// Mozilla does not include the border on body if an element isn't positioned absolute and is without an absolute parent
if (mo && parPos == 'absolute') absparent = true;
// IE does not include the border on the body if an element is position static and without an absolute or relative parent
if (ie && parPos == 'relative') relparent = true;
}
op = parent.offsetParent;
if (options.scroll || mo) {
do {
if (options.scroll) {
// get scroll offsets
sl += parent.scrollLeft;
st += parent.scrollTop;
}
// Mozilla does not add the border for a parent that has overflow set to anything but visible
if (mo && parent != elem && $.css(parent, 'overflow') != 'visible') {
x += num(parent, 'borderLeftWidth');
y += num(parent, 'borderTopWidth');
}
parent = parent.parentNode;
} while (parent != op);
}
parent = op;
if (parent.tagName.toLowerCase() == 'body' || parent.tagName.toLowerCase() == 'html') {
// Safari and IE Standards Mode doesn't add the body margin for elments positioned with static or relative
if ((sf || (ie && $.boxModel)) && elemPos != 'absolute' && elemPos != 'fixed') {
x += num(parent, 'marginLeft');
y += num(parent, 'marginTop');
}
// Mozilla does not include the border on body if an element isn't positioned absolute and is without an absolute parent
// IE does not include the border on the body if an element is positioned static and without an absolute or relative parent
if ( (mo && !absparent && elemPos != 'fixed') ||
(ie && elemPos == 'static' && !relparent) ) {
x += num(parent, 'borderLeftWidth');
y += num(parent, 'borderTopWidth');
}
break; // Exit the loop
}
} while (parent);
}
var returnValue = handleOffsetReturn(elem, options, x, y, sl, st);
if (returnObject) { $.extend(returnObject, returnValue); return this; }
else { return returnValue; }
},
/**
* Returns the location of the element in pixels from the top left corner of the viewport.
* This method is much faster than offset but not as accurate. This method can be invoked
* by setting the lite option to true in the offset method.
*
* @name offsetLite
* @param Map options Optional settings to configure the way the offset is calculated.
* @option Boolean margin Should the margin of the element be included in the calculations? True by default.
* @option Boolean border Should the border of the element be included in the calculations? False by default.
* @option Boolean padding Should the padding of the element be included in the calculations? False by default.
* @option Boolean scroll Should the scroll offsets of the parent elements be included in the calculations? True by default.
* When true it adds the totla scroll offets of all parents to the total offset and also adds two properties
* to the returned object, scrollTop and scrollLeft.
* @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
*/
offsetLite: function(options, returnObject) {
var x = 0, y = 0, sl = 0, st = 0, parent = this[0], op,
options = $.extend({ margin: true, border: false, padding: false, scroll: true }, options || {});
do {
x += parent.offsetLeft;
y += parent.offsetTop;
op = parent.offsetParent;
if (options.scroll) {
// get scroll offsets
do {
sl += parent.scrollLeft;
st += parent.scrollTop;
parent = parent.parentNode;
} while(parent != op);
}
parent = op;
} while (parent && parent.tagName.toLowerCase() != 'body' && parent.tagName.toLowerCase() != 'html');
var returnValue = handleOffsetReturn(this[0], options, x, y, sl, st);
if (returnObject) { $.extend(returnObject, returnValue); return this; }
else { return returnValue; }
}
});
/**
* Handles converting a CSS Style into an Integer.
* @private
*/
var num = function(el, prop) {
return parseInt($.css(el.jquery?el[0]:el,prop))||0;
};
/**
* Handles the return value of the offset and offsetLite methods.
* @private
*/
var handleOffsetReturn = function(elem, options, x, y, sl, st) {
if ( !options.margin ) {
x -= num(elem, 'marginLeft');
y -= num(elem, 'marginTop');
}
// Safari and Opera do not add the border for the element
if ( options.border && ($.browser.safari || $.browser.opera) ) {
x += num(elem, 'borderLeftWidth');
y += num(elem, 'borderTopWidth');
} else if ( !options.border && !($.browser.safari || $.browser.opera) ) {
x -= num(elem, 'borderLeftWidth');
y -= num(elem, 'borderTopWidth');
}
if ( options.padding ) {
x += num(elem, 'paddingLeft');
y += num(elem, 'paddingTop');
}
// do not include scroll offset on the element
if ( options.scroll ) {
sl -= elem.scrollLeft;
st -= elem.scrollTop;
}
return options.scroll ? { top: y - st, left: x - sl, scrollTop: st, scrollLeft: sl }
: { top: y, left: x };
};
})(jQuery);
