src/css.js

   1 // exclude the following css properties to add px
   2 var rexclude = /z-?index|font-?weight|opacity|zoom|line-?height/i,
   3         ralpha = /alpha\([^)]*\)/,
   4         ropacity = /opacity=([^)]*)/,
   5         rfloat = /float/i,
   6         rdashAlpha = /-([a-z])/ig,
   7         rupper = /([A-Z])/g,
   8         rnumpx = /^-?\d+(?:px)?$/i,
   9         rnum = /^-?\d/,
  10
  11         cssShow = { position: "absolute", visibility: "hidden", display:"block" },
  12         cssWidth = [ "Left", "Right" ],
  13         cssHeight = [ "Top", "Bottom" ],
  14         curCSS,
  15
  16         // cache check for defaultView.getComputedStyle
  17         getComputedStyle = document.defaultView && document.defaultView.getComputedStyle,
  18         // normalize float css property
  19         styleFloat = jQuery.support.cssFloat ? "cssFloat" : "styleFloat",
  20         fcamelCase = function( all, letter ) {
  21                 return letter.toUpperCase();
  22         };
  23
  24 jQuery.fn.css = function( name, value ) {
  25         return jQuery.access( this, name, value, true, function( elem, name, value ) {
  26                 if ( value === undefined ) {
  27                         return jQuery.curCSS( elem, name );
  28                 }
  29
  30                 if ( typeof value === "number" && !rexclude.test(name) ) {
  31                         value += "px";
  32                 }
  33
  34                 jQuery.style( elem, name, value );
  35         });
  36 };
  37
  38 jQuery.extend({
  39         cssHooks: {},
  40
  41         style: function( elem, name, value ) {
  42                 // don't set styles on text and comment nodes
  43                 if ( !elem || elem.nodeType === 3 || elem.nodeType === 8 ) {
  44                         return undefined;
  45                 }
  46
  47                 // ignore negative width and height values #1599
  48                 if ( (name === "width" || name === "height") && parseFloat(value) < 0 ) {
  49                         value = undefined;
  50                 }
  51
  52                 var style = elem.style || elem, set = value !== undefined;
  53
  54                 // Make sure we're using the right name for getting the float value
  55                 if ( rfloat.test( name ) ) {
  56                         name = styleFloat;
  57                 }
  58
  59                 name = name.replace(rdashAlpha, fcamelCase);
  60
  61                 var hooks = jQuery.cssHooks[name] || {};
  62
  63                 if ( set && (!("set" in hooks) || hooks.set( elem, value ) === false) ) {
  64                         style[ name ] = value;
  65                 }
  66
  67                 if ( "get" in hooks ) {
  68                         var cssHookReturn = hooks.get( elem, false );
  69                         if ( cssHookReturn !== false ) {
  70                                 return cssHookReturn;
  71                         }
  72                 }
  73
  74                 return style[ name ];
  75         },
  76
  77         css: function( elem, name, force, extra ) {
  78                 if ( name === "width" || name === "height" ) {
  79                         if ( elem.offsetWidth !== 0 ) {
  80                                 val = getWH( elem, name, extra );
  81
  82                         } else {
  83                                 jQuery.swap( elem, cssShow, function() {
  84                                         val = getWH( elem, name, extra );
  85                                 });
  86                         }
  87
  88                         return Math.max(0, Math.round(val));
  89                 }
  90
  91                 return jQuery.curCSS( elem, name, force );
  92         },
  93
  94         curCSS: function( elem, name, force ) {
  95                 var ret, style = elem.style || {}, hooks = jQuery.cssHooks[name] || {};
  96
  97                 // Make sure we're using the right name for getting the float value
  98                 if ( rfloat.test( name ) ) {
  99                         name = styleFloat;
 100                 }
 101
 102                 if ( "get" in hooks && (ret = hooks.get( elem, force )) !== false ) {
 103                         return ret;
 104                 }
 105
 106                 if ( !force && name in style ) {
 107                         ret = style[ name ];
 108
 109                 } else if ( curCSS ) {
 110                         ret = curCSS( elem, name );
 111                 }
 112
 113                 return ret;
 114         },
 115
 116         // A method for quickly swapping in/out CSS properties to get correct calculations
 117         swap: function( elem, options, callback ) {
 118                 var old = {};
 119
 120                 // Remember the old values, and insert the new ones
 121                 for ( var name in options ) {
 122                         old[ name ] = elem.style[ name ];
 123                         elem.style[ name ] = options[ name ];
 124                 }
 125
 126                 callback.call( elem );
 127
 128                 // Revert the old values
 129                 for ( name in options ) {
 130                         elem.style[ name ] = old[ name ];
 131                 }
 132         }
 133 });
 134
 135 if ( !jQuery.support.opacity ) {
 136         jQuery.cssHooks.opacity = {
 137                 get: function( elem, force ) {
 138                         // IE uses filters for opacity
 139                         return ropacity.test(elem.currentStyle.filter || "") ?
 140                                 (parseFloat(RegExp.$1) / 100) + "" :
 141                                 "1";
 142                 },
 143
 144                 set: function( elem, value ) {
 145                         var style = elem.style;
 146
 147                         // IE has trouble with opacity if it does not have layout
 148                         // Force it by setting the zoom level
 149                         style.zoom = 1;
 150
 151                         // Set the alpha filter to set the opacity
 152                         var opacity = parseInt( value, 10 ) + "" === "NaN" ?
 153                                 "" :
 154                                 "alpha(opacity=" + value * 100 + ")";
 155
 156                         var filter = style.filter || jQuery.curCSS( elem, "filter" ) || "";
 157
 158                         style.filter = ralpha.test(filter) ?
 159                                 filter.replace(ralpha, opacity) :
 160                                 opacity;
 161                 }
 162         };
 163 }
 164
 165 if ( getComputedStyle ) {
 166         curCSS = function( elem, name ) {
 167                 var ret, defaultView, computedStyle;
 168
 169                 // Only "float" is needed here
 170                 if ( rfloat.test( name ) ) {
 171                         name = "float";
 172                 }
 173
 174                 name = name.replace( rupper, "-$1" ).toLowerCase();
 175
 176                 if ( !(defaultView = elem.ownerDocument.defaultView) ) {
 177                         return null;
 178                 }
 179
 180                 if ( (computedStyle = defaultView.getComputedStyle( elem, null )) ) {
 181                         ret = computedStyle.getPropertyValue( name );
 182                 }
 183
 184                 // We should always get a number back from opacity
 185                 if ( name === "opacity" && ret === "" ) {
 186                         ret = "1";
 187                 }
 188
 189                 return ret;
 190         };
 191
 192 } else if ( document.documentElement.currentStyle ) {
 193         curCSS = function( elem, name ) {
 194                 var left, rsLeft, camelCase = name.replace(rdashAlpha, fcamelCase),
 195                         ret = elem.currentStyle[ name ] || elem.currentStyle[ camelCase ];
 196
 197                 // From the awesome hack by Dean Edwards
 198                 // http://erik.eae.net/archives/2007/07/27/18.54.15/#comment-102291
 199
 200                 // If we're not dealing with a regular pixel number
 201                 // but a number that has a weird ending, we need to convert it to pixels
 202                 if ( !rnumpx.test( ret ) && rnum.test( ret ) ) {
 203                         // Remember the original values
 204                         left = style.left;
 205                         rsLeft = elem.runtimeStyle.left;
 206
 207                         // Put in the new values to get a computed value out
 208                         elem.runtimeStyle.left = elem.currentStyle.left;
 209                         style.left = camelCase === "fontSize" ? "1em" : (ret || 0);
 210                         ret = style.pixelLeft + "px";
 211
 212                         // Revert the changed values
 213                         style.left = left;
 214                         elem.runtimeStyle.left = rsLeft;
 215                 }
 216
 217                 return ret;
 218         };
 219 }
 220
 221 function getWH( elem, name, extra ) {
 222         var which = name === "width" ? cssWidth : cssHeight,
 223                 val = name === "width" ? elem.offsetWidth : elem.offsetHeight;
 224
 225         if ( extra === "border" ) {
 226                 return val;
 227         }
 228
 229         jQuery.each( which, function() {
 230                 if ( !extra ) {
 231                         val -= parseFloat(jQuery.curCSS( elem, "padding" + this, true)) || 0;
 232                 }
 233
 234                 if ( extra === "margin" ) {
 235                         val += parseFloat(jQuery.curCSS( elem, "margin" + this, true)) || 0;
 236
 237                 } else {
 238                         val -= parseFloat(jQuery.curCSS( elem, "border" + this + "Width", true)) || 0;
 239                 }
 240         });
 241
 242         return val;
 243 }
 244
 245 if ( jQuery.expr && jQuery.expr.filters ) {
 246         jQuery.expr.filters.hidden = function( elem ) {
 247                 var width = elem.offsetWidth, height = elem.offsetHeight,
 248                         skip = elem.nodeName.toLowerCase() === "tr";
 249
 250                 return width === 0 && height === 0 && !skip ?
 251                         true :
 252                         width > 0 && height > 0 && !skip ?
 253                                 false :
 254                                 jQuery.curCSS(elem, "display") === "none";
 255         };
 256
 257         jQuery.expr.filters.visible = function( elem ) {
 258                 return !jQuery.expr.filters.hidden( elem );
 259         };
 260 }