CSS: Effects: relative values

src/css.js

@@ -8,6 +8,7 @@ define([
 	"./css/var/isHidden",
 	"./css/var/getStyles",
 	"./css/curCSS",
+	"./css/cssCastUnit",
 	"./css/defaultDisplay",
 	"./css/addGetHookIf",
 	"./css/support",
@@ -18,15 +19,15 @@ define([
 	"./core/ready",
 	"./selector" // contains
 ], function( jQuery, pnum, access, rmargin, rnumnonpx, cssExpand, isHidden,
-	getStyles, curCSS, defaultDisplay, addGetHookIf, support, dataPriv ) {
+	getStyles, curCSS, cssCastUnit, defaultDisplay, addGetHookIf, support, dataPriv ) {
 
 var
 	// Swappable if display is none or starts with table
 	// except "table", "table-cell", or "table-caption"
 	// See here for display values: https://developer.mozilla.org/en-US/docs/CSS/display
 	rdisplayswap = /^(none|table(?!-c[ea]).+)/,
 	rnumsplit = new RegExp( "^(" + pnum + ")(.*)$", "i" ),
-	rrelNum = new RegExp( "^([+-])=(" + pnum + ")", "i" ),
+	rrelNum = new RegExp( "^([+-])=(" + pnum + ")(.*)", "i" ),
 
 	cssShow = { position: "absolute", visibility: "hidden", display: "block" },
 	cssNormalTransform = {
@@ -273,7 +274,7 @@ jQuery.extend({
 
 			// Convert "+=" or "-=" to relative numbers (#7345)
 			if ( type === "string" && (ret = rrelNum.exec( value )) ) {
-				value = ( ret[1] + 1 ) * ret[2] + parseFloat( jQuery.css( elem, name ) );
+				value = cssCastUnit( elem, name, ret );
 				// Fixes bug #9237
 				type = "number";
 			}
@@ -285,7 +286,7 @@ jQuery.extend({
 
 			// If a number was passed in, add 'px' (except for certain CSS properties)
 			if ( type === "number" && !jQuery.cssNumber[ origName ] ) {
-				value += "px";
+				value += ret && ret[3] ? ret[3] : "px";
 			}
 
 			// Support: IE9-11+

src/css/cssCastUnit.js

@@ -0,0 +1,61 @@
+define([
+	"../core",
+	"../var/rfxnum"
+], function( jQuery, rfxnum ) {
+
+// #2011
+function cssCastUnit( elem, prop, parts, tween ) {
+	var getCSS = tween ?
+			function() { return tween.cur(); } :
+			function() { return jQuery.css( elem, prop, "" ); },
+		target = getCSS(),
+		unit = parts && parts[ 3 ] || ( jQuery.cssNumber[ prop ] ? "" : "px" ),
+		// Starting value computation is required for potential unit mismatches
+		start = ( jQuery.cssNumber[ prop ] || unit !== "px" && +target ) &&
+			rfxnum.exec( jQuery.css( elem, prop ) ),
+		end,
+		scale = 1,
+		maxIterations = 20;
+
+	if ( start && start[ 3 ] !== unit ) {
+		// Trust units reported by jQuery.css
+		unit = unit || start[ 3 ];
+
+		// Make sure we update the tween properties later on
+		parts = parts || [];
+
+		// Iteratively approximate from a nonzero starting point
+		start = +target || 1;
+
+		do {
+			// If previous iteration zeroed out, double until we get *something*.
+			// Use string for doubling so we don't accidentally see scale as unchanged below
+			scale = scale || ".5";
+
+			// Adjust and apply
+			start = start / scale;
+			jQuery.style( elem, prop, start + unit );
+
+			// Update scale, tolerating zero or NaN from tween.cur(),
+			// break the loop if scale is unchanged or perfect, or if we've just had enough
+		} while (
+			scale !== (scale = getCSS() / target) && scale !== 1 && --maxIterations
+		);
+	}
+
+	if ( parts ) {
+		start = +start || +target || 0;
+		end = parts[ 1 ] ?
+			start + ( parts[ 1 ] + 1 ) * parts[ 2 ] :
+			+parts[ 2 ];
+		if ( tween ) {
+			tween.unit = unit;
+			tween.start = start;
+			tween.end = end;
+		}
+	}
+	return end || parts.input;
+}
+
+return cssCastUnit;
+});

src/effects.js

@@ -2,8 +2,10 @@ define([
 	"./core",
 	"./var/document",
 	"./var/pnum",
+	"./var/rfxnum",
 	"./css/var/cssExpand",
 	"./css/var/isHidden",
+	"./css/cssCastUnit",
 	"./css/defaultDisplay",
 	"./data/var/dataPriv",
 
@@ -13,63 +15,18 @@ define([
 	"./css",
 	"./deferred",
 	"./traversing"
-], function( jQuery, document, pnum, cssExpand, isHidden, defaultDisplay, dataPriv ) {
+], function( jQuery, document, pnum, rfxnum, cssExpand,
+	isHidden, cssCastUnit, defaultDisplay, dataPriv ) {
 
 var
 	fxNow, timerId,
 	rfxtypes = /^(?:toggle|show|hide)$/,
-	rfxnum = new RegExp( "^(?:([+-])=|)(" + pnum + ")([a-z%]*)$", "i" ),
 	rrun = /queueHooks$/,
 	animationPrefilters = [ defaultPrefilter ],
 	tweeners = {
 		"*": [ function( prop, value ) {
-			var tween = this.createTween( prop, value ),
-				target = tween.cur(),
-				parts = rfxnum.exec( value ),
-				unit = parts && parts[ 3 ] || ( jQuery.cssNumber[ prop ] ? "" : "px" ),
-
-				// Starting value computation is required for potential unit mismatches
-				start = ( jQuery.cssNumber[ prop ] || unit !== "px" && +target ) &&
-					rfxnum.exec( jQuery.css( tween.elem, prop ) ),
-				scale = 1,
-				maxIterations = 20;
-
-			if ( start && start[ 3 ] !== unit ) {
-				// Trust units reported by jQuery.css
-				unit = unit || start[ 3 ];
-
-				// Make sure we update the tween properties later on
-				parts = parts || [];
-
-				// Iteratively approximate from a nonzero starting point
-				start = +target || 1;
-
-				do {
-					// If previous iteration zeroed out, double until we get *something*.
-					// Use string for doubling so we don't accidentally see scale as unchanged below
-					scale = scale || ".5";
-
-					// Adjust and apply
-					start = start / scale;
-					jQuery.style( tween.elem, prop, start + unit );
-
-				// Update scale, tolerating zero or NaN from tween.cur(),
-				// break the loop if scale is unchanged or perfect, or if we've just had enough
-				} while (
-					scale !== (scale = tween.cur() / target) && scale !== 1 && --maxIterations
-				);
-			}
-
-			// Update tween properties
-			if ( parts ) {
-				start = tween.start = +start || +target || 0;
-				tween.unit = unit;
-				// If a +=/-= token was provided, we're doing a relative animation
-				tween.end = parts[ 1 ] ?
-					start + ( parts[ 1 ] + 1 ) * parts[ 2 ] :
-					+parts[ 2 ];
-			}
-
+			var tween = this.createTween( prop, value );
+			cssCastUnit( tween.elem, prop, rfxnum.exec( value ), tween );
 			return tween;
 		} ]
 	};

src/var/rfxnum.js

@@ -0,0 +1,7 @@
+define([
+	"../var/pnum"
+], function( pnum ) {
+
+return new RegExp( "^(?:([+-])=|)(" + pnum + ")([a-z%]*)$", "i" );
+
+});