Effects Core: Do not overwrite css or class changes that aren't animated during class animation. Fixed #7106 - animateClass: css and class changes during animation are lost

1 files changed, 16 insertions, 16 deletions

diff --git a/ui/jquery.effects.core.js b/ui/jquery.effects.core.js
index 3dc0a4e67..a47880e7f 100644
--- a/ui/jquery.effects.core.js
+++ b/ui/jquery.effects.core.js
@@ -224,7 +224,7 @@ $.effects.animateClass = function( value, duration, easing, callback ) {
 	return this.queue( function() {
 		var animated = $( this ),
 			baseClass = animated.attr( "class" ) || "",
-			finalClass,
+			applyClassChange,
 			allAnimations = o.children ? animated.find( "*" ).andSelf() : animated;
 
 		// map the animated objects to store the original styles.
@@ -232,18 +232,19 @@ $.effects.animateClass = function( value, duration, easing, callback ) {
 			var el = $( this );
 			return {
 				el: el,
-				originalStyleAttr: el.attr( "style" ) || " ",
 				start: getElementStyles.call( this )
 			};
 		});
 
 		// apply class change
-		$.each( classAnimationActions, function(i, action) {
-			if ( value[ action ] ) {
-				animated[ action + "Class" ]( value[ action ] );
-			}
-		});
-		finalClass = animated.attr( "class" );
+		applyClassChange = function() {
+			$.each( classAnimationActions, function(i, action) {
+				if ( value[ action ] ) {
+					animated[ action + "Class" ]( value[ action ] );
+				}
+			});
+		};
+		applyClassChange();
 
 		// map all animated objects again - calculate new styles and diff
 		allAnimations = allAnimations.map(function() {
@@ -275,16 +276,15 @@ $.effects.animateClass = function( value, duration, easing, callback ) {
 		$.when.apply( $, allAnimations.get() ).done(function() {
 
 			// set the final class
-			animated.attr( "class", finalClass );
+			applyClassChange();
 
-			// for each animated element
+			// for each animated element,
+			// clear all css properties that were animated
 			$.each( arguments, function() {
-				if ( typeof this.el.attr( "style" ) === "object" ) {
-					this.el.attr( "style" ).cssText = "";
-					this.el.attr( "style" ).cssText = this.originalStyleAttr;
-				} else {
-					this.el.attr( "style", this.originalStyleAttr );
-				}
+				var el = this.el;
+				$.each( this.diff, function(key) {
+					el.css( key, '' );
+				});
 			});
 
 			// this is guarnteed to be there if you use jQuery.speed()