19c6342d22b853fd087becaec4b373bbb5b16eaa
[jquery.git] / src / css.js
1 (function( jQuery ) {
2
3 var ralpha = /alpha\([^)]*\)/i,
4         ropacity = /opacity=([^)]*)/,
5         rdashAlpha = /-([a-z])/ig,
6         rupper = /([A-Z])/g,
7         rnumpx = /^-?\d+(?:px)?$/i,
8         rnum = /^-?\d/,
9
10         cssShow = { position: "absolute", visibility: "hidden", display: "block" },
11         cssWidth = [ "Left", "Right" ],
12         cssHeight = [ "Top", "Bottom" ],
13         curCSS,
14
15         getComputedStyle,
16         currentStyle,
17
18         fcamelCase = function( all, letter ) {
19                 return letter.toUpperCase();
20         };
21
22 jQuery.fn.css = function( name, value ) {
23         // Setting 'undefined' is a no-op
24         if ( arguments.length === 2 && value === undefined ) {
25                 return this;
26         }
27
28         return jQuery.access( this, name, value, true, function( elem, name, value ) {
29                 return value !== undefined ?
30                         jQuery.style( elem, name, value ) :
31                         jQuery.css( elem, name );
32         });
33 };
34
35 jQuery.extend({
36         // Add in style property hooks for overriding the default
37         // behavior of getting and setting a style property
38         cssHooks: {
39                 opacity: {
40                         get: function( elem, computed ) {
41                                 if ( computed ) {
42                                         // We should always get a number back from opacity
43                                         var ret = curCSS( elem, "opacity", "opacity" );
44                                         return ret === "" ? "1" : ret;
45
46                                 } else {
47                                         return elem.style.opacity;
48                                 }
49                         }
50                 }
51         },
52
53         // Exclude the following css properties to add px
54         cssNumber: {
55                 "zIndex": true,
56                 "fontWeight": true,
57                 "opacity": true,
58                 "zoom": true,
59                 "lineHeight": true
60         },
61
62         // Add in properties whose names you wish to fix before
63         // setting or getting the value
64         cssProps: {
65                 // normalize float css property
66                 "float": jQuery.support.cssFloat ? "cssFloat" : "styleFloat"
67         },
68
69         // Get and set the style property on a DOM Node
70         style: function( elem, name, value, extra ) {
71                 // Don't set styles on text and comment nodes
72                 if ( !elem || elem.nodeType === 3 || elem.nodeType === 8 || !elem.style ) {
73                         return;
74                 }
75
76                 // Make sure that we're working with the right name
77                 var ret, origName = jQuery.camelCase( name ),
78                         style = elem.style, hooks = jQuery.cssHooks[ origName ];
79
80                 name = jQuery.cssProps[ origName ] || origName;
81
82                 // Check if we're setting a value
83                 if ( value !== undefined ) {
84                         // Make sure that NaN and null values aren't set. See: #7116
85                         if ( typeof value === "number" && isNaN( value ) || value == null ) {
86                                 return;
87                         }
88
89                         // If a number was passed in, add 'px' to the (except for certain CSS properties)
90                         if ( typeof value === "number" && !jQuery.cssNumber[ origName ] ) {
91                                 value += "px";
92                         }
93
94                         // If a hook was provided, use that value, otherwise just set the specified value
95                         if ( !hooks || !("set" in hooks) || (value = hooks.set( elem, value )) !== undefined ) {
96                                 // Wrapped to prevent IE from throwing errors when 'invalid' values are provided
97                                 // Fixes bug #5509
98                                 try {
99                                         style[ name ] = value;
100                                 } catch(e) {}
101                         }
102
103                 } else {
104                         // If a hook was provided get the non-computed value from there
105                         if ( hooks && "get" in hooks && (ret = hooks.get( elem, false, extra )) !== undefined ) {
106                                 return ret;
107                         }
108
109                         // Otherwise just get the value from the style object
110                         return style[ name ];
111                 }
112         },
113
114         css: function( elem, name, extra ) {
115                 // Make sure that we're working with the right name
116                 var ret, origName = jQuery.camelCase( name ),
117                         hooks = jQuery.cssHooks[ origName ];
118
119                 name = jQuery.cssProps[ origName ] || origName;
120
121                 // If a hook was provided get the computed value from there
122                 if ( hooks && "get" in hooks && (ret = hooks.get( elem, true, extra )) !== undefined ) {
123                         return ret;
124
125                 // Otherwise, if a way to get the computed value exists, use that
126                 } else if ( curCSS ) {
127                         return curCSS( elem, name, origName );
128                 }
129         },
130
131         // A method for quickly swapping in/out CSS properties to get correct calculations
132         swap: function( elem, options, callback ) {
133                 var old = {};
134
135                 // Remember the old values, and insert the new ones
136                 for ( var name in options ) {
137                         old[ name ] = elem.style[ name ];
138                         elem.style[ name ] = options[ name ];
139                 }
140
141                 callback.call( elem );
142
143                 // Revert the old values
144                 for ( name in options ) {
145                         elem.style[ name ] = old[ name ];
146                 }
147         },
148
149         camelCase: function( string ) {
150                 return string.replace( rdashAlpha, fcamelCase );
151         }
152 });
153
154 // DEPRECATED, Use jQuery.css() instead
155 jQuery.curCSS = jQuery.css;
156
157 jQuery.each(["height", "width"], function( i, name ) {
158         jQuery.cssHooks[ name ] = {
159                 get: function( elem, computed, extra ) {
160                         var val;
161
162                         if ( computed ) {
163                                 if ( elem.offsetWidth !== 0 ) {
164                                         val = getWH( elem, name, extra );
165
166                                 } else {
167                                         jQuery.swap( elem, cssShow, function() {
168                                                 val = getWH( elem, name, extra );
169                                         });
170                                 }
171
172                                 if ( val <= 0 ) {
173                                         val = curCSS( elem, name, name );
174
175                                         if ( val === "0px" && currentStyle ) {
176                                                 val = currentStyle( elem, name, name );
177                                         }
178
179                                         if ( val != null ) {
180                                                 // Should return "auto" instead of 0, use 0 for
181                                                 // temporary backwards-compat
182                                                 return val === "" || val === "auto" ? "0px" : val;
183                                         }
184                                 }
185
186                                 if ( val < 0 || val == null ) {
187                                         val = elem.style[ name ];
188
189                                         // Should return "auto" instead of 0, use 0 for
190                                         // temporary backwards-compat
191                                         return val === "" || val === "auto" ? "0px" : val;
192                                 }
193
194                                 return typeof val === "string" ? val : val + "px";
195                         }
196                 },
197
198                 set: function( elem, value ) {
199                         if ( rnumpx.test( value ) ) {
200                                 // ignore negative width and height values #1599
201                                 value = parseFloat(value);
202
203                                 if ( value >= 0 ) {
204                                         return value + "px";
205                                 }
206
207                         } else {
208                                 return value;
209                         }
210                 }
211         };
212 });
213
214 if ( !jQuery.support.opacity ) {
215         jQuery.cssHooks.opacity = {
216                 get: function( elem, computed ) {
217                         // IE uses filters for opacity
218                         return ropacity.test((computed && elem.currentStyle ? elem.currentStyle.filter : elem.style.filter) || "") ?
219                                 (parseFloat(RegExp.$1) / 100) + "" :
220                                 computed ? "1" : "";
221                 },
222
223                 set: function( elem, value ) {
224                         var style = elem.style;
225
226                         // IE has trouble with opacity if it does not have layout
227                         // Force it by setting the zoom level
228                         style.zoom = 1;
229
230                         // Set the alpha filter to set the opacity
231                         var opacity = jQuery.isNaN(value) ?
232                                 "" :
233                                 "alpha(opacity=" + value * 100 + ")",
234                                 filter = style.filter || "";
235
236                         style.filter = ralpha.test(filter) ?
237                                 filter.replace(ralpha, opacity) :
238                                 style.filter + ' ' + opacity;
239                 }
240         };
241 }
242
243 if ( document.defaultView && document.defaultView.getComputedStyle ) {
244         getComputedStyle = function( elem, newName, name ) {
245                 var ret, defaultView, computedStyle;
246
247                 name = name.replace( rupper, "-$1" ).toLowerCase();
248
249                 if ( !(defaultView = elem.ownerDocument.defaultView) ) {
250                         return undefined;
251                 }
252
253                 if ( (computedStyle = defaultView.getComputedStyle( elem, null )) ) {
254                         ret = computedStyle.getPropertyValue( name );
255                         if ( ret === "" && !jQuery.contains( elem.ownerDocument.documentElement, elem ) ) {
256                                 ret = jQuery.style( elem, name );
257                         }
258                 }
259
260                 return ret;
261         };
262 }
263
264 if ( document.documentElement.currentStyle ) {
265         currentStyle = function( elem, name ) {
266                 var left, 
267                         ret = elem.currentStyle && elem.currentStyle[ name ],
268                         rsLeft = elem.runtimeStyle && elem.runtimeStyle[ name ],
269                         style = elem.style;
270
271                 // From the awesome hack by Dean Edwards
272                 // http://erik.eae.net/archives/2007/07/27/18.54.15/#comment-102291
273
274                 // If we're not dealing with a regular pixel number
275                 // but a number that has a weird ending, we need to convert it to pixels
276                 if ( !rnumpx.test( ret ) && rnum.test( ret ) ) {
277                         // Remember the original values
278                         left = style.left;
279
280                         // Put in the new values to get a computed value out
281                         if ( rsLeft ) {
282                                 elem.runtimeStyle.left = elem.currentStyle.left;
283                         }
284                         style.left = name === "fontSize" ? "1em" : (ret || 0);
285                         ret = style.pixelLeft + "px";
286
287                         // Revert the changed values
288                         style.left = left;
289                         if ( rsLeft ) {
290                                 elem.runtimeStyle.left = rsLeft;
291                         }
292                 }
293
294                 return ret === "" ? "auto" : ret;
295         };
296 }
297
298 curCSS = getComputedStyle || currentStyle;
299
300 function getWH( elem, name, extra ) {
301         var which = name === "width" ? cssWidth : cssHeight,
302                 val = name === "width" ? elem.offsetWidth : elem.offsetHeight;
303
304         if ( extra === "border" ) {
305                 return val;
306         }
307
308         jQuery.each( which, function() {
309                 if ( !extra ) {
310                         val -= parseFloat(jQuery.css( elem, "padding" + this )) || 0;
311                 }
312
313                 if ( extra === "margin" ) {
314                         val += parseFloat(jQuery.css( elem, "margin" + this )) || 0;
315
316                 } else {
317                         val -= parseFloat(jQuery.css( elem, "border" + this + "Width" )) || 0;
318                 }
319         });
320
321         return val;
322 }
323
324 if ( jQuery.expr && jQuery.expr.filters ) {
325         jQuery.expr.filters.hidden = function( elem ) {
326                 var width = elem.offsetWidth,
327                         height = elem.offsetHeight;
328
329                 return (width === 0 && height === 0) || (!jQuery.support.reliableHiddenOffsets && (elem.style.display || jQuery.css( elem, "display" )) === "none");
330         };
331
332         jQuery.expr.filters.visible = function( elem ) {
333                 return !jQuery.expr.filters.hidden( elem );
334         };
335 }
336
337 })( jQuery );