diff --git a/src/css.js b/src/css.js index 17ac136b..65ec20f5 100644 --- a/src/css.js +++ b/src/css.js @@ -7,6 +7,8 @@ var ralpha = /alpha\([^)]*\)/i, rupper = /([A-Z]|^ms)/g, rnumpx = /^-?\d+(?:px)?$/i, rnum = /^-?\d/, + rrelNum = /^[+\-]=/, + rrelNumFilter = /[^+\-\.\de]+/g, cssShow = { position: "absolute", visibility: "hidden", display: "block" }, cssWidth = [ "Left", "Right" ], @@ -75,20 +77,27 @@ jQuery.extend({ } // Make sure that we're working with the right name - var ret, origName = jQuery.camelCase( name ), + var ret, type, origName = jQuery.camelCase( name ), style = elem.style, hooks = jQuery.cssHooks[ origName ]; name = jQuery.cssProps[ origName ] || origName; // Check if we're setting a value if ( value !== undefined ) { + type = typeof value; + // Make sure that NaN and null values aren't set. See: #7116 - if ( typeof value === "number" && isNaN( value ) || value == null ) { + if ( type === "number" && isNaN( value ) || value == null ) { return; } + // convert relative number strings (+= or -=) to relative numbers. #7345 + if ( type === "string" && rrelNum.test( value ) ) { + value = +value.replace( rrelNumFilter, '' ) + parseFloat( jQuery.css( elem, name ) ); + } + // If a number was passed in, add 'px' to the (except for certain CSS properties) - if ( typeof value === "number" && !jQuery.cssNumber[ origName ] ) { + if ( type === "number" && !jQuery.cssNumber[ origName ] ) { value += "px"; } diff --git a/test/unit/css.js b/test/unit/css.js index 8ae8fcb3..08f50ef2 100644 --- a/test/unit/css.js +++ b/test/unit/css.js @@ -105,6 +105,38 @@ test("css(String|Hash)", function() { equals( child[0].style.fontSize, old, "Make sure font-size isn't changed on null." ); }); +test("css() explicit and relative values", function() { + expect(9); + var $elem = jQuery('#nothiddendiv'); + + $elem.css({ width: 1, height: 1 }); + equals( $elem.width(), 1, "Initial css set or width/height works (hash)" ); + + $elem.css({ width: "+=9" }); + equals( $elem.width(), 10, "'+=9' on width (hash)" ); + + $elem.css({ width: "-=9" }); + equals( $elem.width(), 1, "'-=9' on width (hash)" ); + + $elem.css({ width: "+=9px" }); + equals( $elem.width(), 10, "'+=9px' on width (hash)" ); + + $elem.css({ width: "-=9px" }); + equals( $elem.width(), 1, "'-=9px' on width (hash)" ); + + $elem.css( "width", "+=9" ); + equals( $elem.width(), 10, "'+=9' on width (params)" ); + + $elem.css( "width", "-=9" ) ; + equals( $elem.width(), 1, "'-=9' on width (params)" ); + + $elem.css( "width", "+=9px" ); + equals( $elem.width(), 10, "'+=9px' on width (params)" ); + + $elem.css( "width", "-=9px" ); + equals( $elem.width(), 1, "'-=9px' on width (params)" ); +}); + test("css(String, Object)", function() { expect(22);