Skip to content

J
jquery
Commit 920099b2 authored by John Resig's avatar John Resig
Browse files
Options

First pass at unifying the various CSS methods in jQuery (jQuery.style,... 

First pass at unifying the various CSS methods in jQuery (jQuery.style, jQuery.curCSS, and jQuery.css are now all under jQuery.css).
parent 2912f8ab
Hide whitespace changes
Inline Side-by-side
Showing with 66 additions and 94 deletions
src/attributes.js
View file @ 920099b2
......@@ -339,9 +339,5 @@ jQuery.extend({
// Non-existent attributes return null, we normalize to undefined
return attr === null ? undefined : attr;
}
// elem is actually elem.style ... set the style
// Using attr for specific style information is now deprecated. Use style instead.
return jQuery.style( elem, name, value );
}
});
src/css.js
View file @ 920099b2
......@@ -23,94 +23,51 @@ var rexclude = /z-?index|font-?weight|opacity|zoom|line-?height/i,
jQuery.fn.css = function( name, value ) {
return jQuery.access( this, name, value, true, function( elem, name, value ) {
if ( value === undefined ) {
return jQuery.curCSS( elem, name );
}
if ( typeof value === "number" && !rexclude.test(name) ) {
value += "px";
}
jQuery.style( elem, name, value );
jQuery.css( elem, name, value );
});
};
jQuery.extend({
cssHooks: {},
style: function( elem, name, value ) {
css: function( elem, name, value, force, extra ) {
// don't set styles on text and comment nodes
if ( !elem || elem.nodeType === 3 || elem.nodeType === 8 ) {
return undefined;
}
// ignore negative width and height values #1599
if ( (name === "width" || name === "height") && parseFloat(value) < 0 ) {
value = undefined;
}
var style = elem.style || elem, set = value !== undefined;
// Make sure we're using the right name for getting the float value
if ( rfloat.test( name ) ) {
name = styleFloat;
}
name = name.replace(rdashAlpha, fcamelCase);
name = name.replace( rdashAlpha, fcamelCase );
var hooks = jQuery.cssHooks[name] || {};
if ( set && (!("set" in hooks) || hooks.set( elem, value ) === false) ) {
style[ name ] = value;
}
var ret, style = elem.style || {}, hooks = jQuery.cssHooks[name] || {};
if ( "get" in hooks ) {
var cssHookReturn = hooks.get( elem, false );
if ( cssHookReturn !== false ) {
return cssHookReturn;
if ( value !== undefined ) {
if ( typeof value === "number" && !rexclude.test(name) ) {
value += "px";
}
}
return style[ name ];
},
css: function( elem, name, force, extra ) {
if ( name === "width" || name === "height" ) {
if ( elem.offsetWidth !== 0 ) {
val = getWH( elem, name, extra );
} else {
jQuery.swap( elem, cssShow, function() {
val = getWH( elem, name, extra );
});
if ( !("set" in hooks) || (value = hooks.set( elem, value )) === false ) {
style[ name ] = value;
}
return Math.max(0, Math.round(val));
}
return jQuery.curCSS( elem, name, force );
},
} else {
if ( "get" in hooks && (ret = hooks.get( elem, force, extra )) !== false ) {
return ret;
}
curCSS: function( elem, name, force ) {
var ret, style = elem.style || {}, hooks = jQuery.cssHooks[name] || {};
if ( !force && name in style ) {
ret = style[ name ];
// Make sure we're using the right name for getting the float value
if ( rfloat.test( name ) ) {
name = styleFloat;
}
} else if ( curCSS ) {
ret = curCSS( elem, name );
}
if ( "get" in hooks && (ret = hooks.get( elem, force )) !== false ) {
return ret;
}
if ( !force && name in style ) {
ret = style[ name ];
} else if ( curCSS ) {
ret = curCSS( elem, name );
}
return ret;
},
// A method for quickly swapping in/out CSS properties to get correct calculations
......@@ -132,6 +89,26 @@ jQuery.extend({
}
});
jQuery.each(["height", "width"], function( i, name ) {
jQuery.cssHooks[ name ] = {
get: function( elem, force, extra ) {
if ( elem.offsetWidth !== 0 ) {
val = getWH( elem, name, extra );
} else {
jQuery.swap( elem, cssShow, function() {
val = getWH( elem, name, extra );
});
}
},
set: function( elem, value ) {
// ignore negative width and height values #1599
elem.style[ name ] = Math.max( parseFloat(value), 0 );
}
};
});
if ( !jQuery.support.opacity ) {
jQuery.cssHooks.opacity = {
get: function( elem, force ) {
......@@ -153,7 +130,7 @@ if ( !jQuery.support.opacity ) {
"" :
"alpha(opacity=" + value * 100 + ")";
var filter = style.filter || jQuery.curCSS( elem, "filter" ) || "";
var filter = style.filter || jQuery.css( elem, "filter" ) || "";
style.filter = ralpha.test(filter) ?
filter.replace(ralpha, opacity) :
......@@ -191,8 +168,7 @@ if ( getComputedStyle ) {
} else if ( document.documentElement.currentStyle ) {
curCSS = function( elem, name ) {
var left, rsLeft, camelCase = name.replace(rdashAlpha, fcamelCase),
ret = elem.currentStyle[ name ] || elem.currentStyle[ camelCase ];
var left, rsLeft, ret = elem.currentStyle[ name ];
// From the awesome hack by Dean Edwards
// http://erik.eae.net/archives/2007/07/27/18.54.15/#comment-102291
......@@ -206,7 +182,7 @@ if ( getComputedStyle ) {
// Put in the new values to get a computed value out
elem.runtimeStyle.left = elem.currentStyle.left;
style.left = camelCase === "fontSize" ? "1em" : (ret || 0);
style.left = name === "fontSize" ? "1em" : (ret || 0);
ret = style.pixelLeft + "px";
// Revert the changed values
......@@ -228,14 +204,14 @@ function getWH( elem, name, extra ) {
jQuery.each( which, function() {
if ( !extra ) {
val -= parseFloat(jQuery.curCSS( elem, "padding" + this, true)) || 0;
val -= parseFloat(jQuery.css( elem, "padding" + this, undefined, true)) || 0;
}
if ( extra === "margin" ) {
val += parseFloat(jQuery.curCSS( elem, "margin" + this, true)) || 0;
val += parseFloat(jQuery.css( elem, "margin" + this, undefined, true)) || 0;
} else {
val -= parseFloat(jQuery.curCSS( elem, "border" + this + "Width", true)) || 0;
val -= parseFloat(jQuery.css( elem, "border" + this + "Width", undefined, true)) || 0;
}
});
......@@ -251,7 +227,7 @@ if ( jQuery.expr && jQuery.expr.filters ) {
true :
width > 0 && height > 0 && !skip ?
false :
jQuery.curCSS(elem, "display") === "none";
jQuery.css(elem, "display") === "none";
};
jQuery.expr.filters.visible = function( elem ) {
......
src/dimensions.js
View file @ 920099b2
......@@ -6,14 +6,14 @@ jQuery.each([ "Height", "Width" ], function( i, name ) {
// innerHeight and innerWidth
jQuery.fn["inner" + name] = function() {
return this[0] ?
jQuery.css( this[0], type, false, "padding" ) :
jQuery.css( this[0], type, undefined, false, "padding" ) :
null;
};
// outerHeight and outerWidth
jQuery.fn["outer" + name] = function( margin ) {
return this[0] ?
jQuery.css( this[0], type, false, margin ? "margin" : "border" ) :
jQuery.css( this[0], type, undefined, false, margin ? "margin" : "border" ) :
null;
};
......
src/effects.js
View file @ 920099b2
......@@ -64,7 +64,7 @@ jQuery.fn.extend({
for ( var i = 0, l = this.length; i < l; i++ ) {
var old = jQuery.data(this[i], "olddisplay");
if ( !old && old !== "none" ) {
jQuery.data(this[i], "olddisplay", jQuery.css(this[i], "display"));
jQuery.data( this[i], "olddisplay", jQuery.css(this[i], "display") );
}
}
......@@ -314,8 +314,8 @@ jQuery.fx.prototype = {
return this.elem[ this.prop ];
}
var r = parseFloat(jQuery.css(this.elem, this.prop, force));
return r && r > -10000 ? r : parseFloat(jQuery.curCSS(this.elem, this.prop)) || 0;
var r = parseFloat(jQuery.css(this.elem, this.prop, undefined, force));
return r && r > -10000 ? r : parseFloat(jQuery.css(this.elem, this.prop)) || 0;
},
// Start an animation from one number to another
......@@ -342,7 +342,7 @@ jQuery.fx.prototype = {
// Simple 'show' function
show: function() {
// Remember where we started, so that we can go back to it later
this.options.orig[this.prop] = jQuery.style( this.elem, this.prop );
this.options.orig[this.prop] = jQuery.css( this.elem, this.prop );
this.options.show = true;
// Begin the animation
......@@ -357,7 +357,7 @@ jQuery.fx.prototype = {
// Simple 'hide' function
hide: function() {
// Remember where we started, so that we can go back to it later
this.options.orig[this.prop] = jQuery.style( this.elem, this.prop );
this.options.orig[this.prop] = jQuery.css( this.elem, this.prop );
this.options.hide = true;
// Begin the animation
......@@ -403,7 +403,7 @@ jQuery.fx.prototype = {
// Reset the properties, if the item has been hidden or shown
if ( this.options.hide || this.options.show ) {
for ( var p in this.options.curAnim ) {
jQuery.style(this.elem, p, this.options.orig[p]);
jQuery.css( this.elem, p, this.options.orig[p] );
}
}
......@@ -460,7 +460,7 @@ jQuery.extend( jQuery.fx, {
step: {
opacity: function( fx ) {
jQuery.style(fx.elem, "opacity", fx.now);
jQuery.css( fx.elem, "opacity", fx.now );
},
_default: function( fx ) {
......
src/offset.js
View file @ 920099b2
......@@ -103,7 +103,7 @@ if ( "getBoundingClientRect" in document.documentElement ) {
jQuery.offset = {
initialize: function() {
var body = document.body, container = document.createElement("div"), innerDiv, checkDiv, table, td, bodyMarginTop = parseFloat( jQuery.curCSS(body, "marginTop", true) ) || 0,
var body = document.body, container = document.createElement("div"), innerDiv, checkDiv, table, td, bodyMarginTop = parseFloat( jQuery.css(body, "marginTop", undefined, true) ) || 0,
html = "<div style='position:absolute;top:0;left:0;margin:0;border:5px solid #000;padding:0;width:1px;height:1px;'><div></div></div><table style='position:absolute;top:0;left:0;margin:0;border:5px solid #000;padding:0;width:1px;height:1px;' cellpadding='0' cellspacing='0'><tr><td></td></tr></table>";
jQuery.extend( container.style, { position: "absolute", top: 0, left: 0, margin: 0, border: 0, width: "1px", height: "1px", visibility: "hidden" } );
......@@ -142,25 +142,25 @@ jQuery.offset = {
jQuery.offset.initialize();
if ( jQuery.offset.doesNotIncludeMarginInBodyOffset ) {
top += parseFloat( jQuery.curCSS(body, "marginTop", true) ) || 0;
left += parseFloat( jQuery.curCSS(body, "marginLeft", true) ) || 0;
top += parseFloat( jQuery.css(body, "marginTop", undefined, true) ) || 0;
left += parseFloat( jQuery.css(body, "marginLeft", undefined, true) ) || 0;
}
return { top: top, left: left };
},
setOffset: function( elem, options, i ) {
var position = jQuery.curCSS( elem, "position" );
var position = jQuery.css( elem, "position" );
// set position first, in-case top/left are set even on static elem
if ( position === "static" ) {
elem.style.position = "relative";
}
var curElem = jQuery( elem ),
curOffset = curElem.offset(),
curCSSTop = jQuery.curCSS( elem, "top", true ),
curCSSLeft = jQuery.curCSS( elem, "left", true ),
var curElem = jQuery( elem ),
curOffset = curElem.offset(),
curCSSTop = jQuery.css( elem, "top", undefined, true ),
curCSSLeft = jQuery.css( elem, "left", undefined, true ),
calculatePosition = (position === "absolute" && jQuery.inArray('auto', [curCSSTop, curCSSLeft]) > -1),
props = {}, curPosition = {}, curTop, curLeft;
......@@ -210,12 +210,12 @@ jQuery.fn.extend({
// Subtract element margins
// note: when an element has margin: auto the offsetLeft and marginLeft
// are the same in Safari causing offset.left to incorrectly be 0
offset.top -= parseFloat( jQuery.curCSS(elem, "marginTop", true) ) || 0;
offset.left -= parseFloat( jQuery.curCSS(elem, "marginLeft", true) ) || 0;
offset.top -= parseFloat( jQuery.css(elem, "marginTop", undefined, true) ) || 0;
offset.left -= parseFloat( jQuery.css(elem, "marginLeft", undefined, true) ) || 0;
// Add offsetParent borders
parentOffset.top += parseFloat( jQuery.curCSS(offsetParent[0], "borderTopWidth", true) ) || 0;
parentOffset.left += parseFloat( jQuery.curCSS(offsetParent[0], "borderLeftWidth", true) ) || 0;
parentOffset.top += parseFloat( jQuery.css(offsetParent[0], "borderTopWidth", undefined, true) ) || 0;
parentOffset.left += parseFloat( jQuery.css(offsetParent[0], "borderLeftWidth", undefined, true) ) || 0;
// Subtract the two offsets
return {
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment