diff --git a/src/effects.js b/src/effects.js
index 88986af7..c18a671d 100644
--- a/src/effects.js
+++ b/src/effects.js
@@ -141,7 +141,8 @@ jQuery.fn.extend({
isElement = this.nodeType === 1,
hidden = isElement && jQuery(this).is(":hidden"),
name, val, p, e,
- parts, start, end, unit;
+ parts, start, end, unit,
+ method;
// will store per property easing and be used to determine when an animation is complete
opt.animatedProperties = {};
@@ -203,7 +204,15 @@ jQuery.fn.extend({
val = prop[ p ];
if ( rfxtypes.test( val ) ) {
- e[ val === "toggle" ? hidden ? "show" : "hide" : val ]();
+ // Tracks whether to show or hide based on private
+ // data attached to the element
+ method = jQuery._data( this, "toggle" + p ) || (val === "toggle" ? hidden ? "show" : "hide" : 0);
+ if ( method ) {
+ jQuery._data( this, "toggle" + p, method === "show" ? "hide" : "show" );
+ e[ method ]();
+ } else {
+ e[ val ]();
+ }
} else {
parts = rfxnum.exec( val );
@@ -246,6 +255,7 @@ jQuery.fn.extend({
this.each(function() {
var timers = jQuery.timers,
i = timers.length;
+
// clear marker counters if we know they won't be
if ( !gotoEnd ) {
jQuery._unmark( true, this );
@@ -255,6 +265,8 @@ jQuery.fn.extend({
if ( gotoEnd ) {
// force the next step to be the last
timers[ i ]( true );
+ } else {
+ timers[ i ].saveState();
}
timers.splice(i, 1);
@@ -398,6 +410,11 @@ jQuery.fx.prototype = {
}
t.elem = this.elem;
+ t.saveState = function() {
+ if ( self.options.hide && jQuery._data( self.elem, "fxshow" + self.prop ) === undefined ) {
+ jQuery._data( self.elem, "fxshow" + self.prop, self.start );
+ }
+ };
if ( t() && jQuery.timers.push(t) && !timerId ) {
// Use requestAnimationFrame instead of setInterval if available
@@ -419,14 +436,20 @@ jQuery.fx.prototype = {
// Simple 'show' function
show: function() {
+ var dataShow = jQuery._data( this.elem, "fxshow" + this.prop );
+
// Remember where we started, so that we can go back to it later
- this.options.orig[ this.prop ] = jQuery.style( this.elem, this.prop );
+ this.options.orig[ this.prop ] = dataShow || jQuery.style( this.elem, this.prop );
this.options.show = true;
// Begin the animation
- // Make sure that we start at a small width/height to avoid any
- // flash of content
- this.custom( this.prop === "width" || this.prop === "height" ? 1 : 0, this.cur() );
+ // Make sure that we start at a small width/height to avoid any flash of content
+ if ( dataShow !== undefined ) {
+ // This show is picking up where a previous hide or show left off
+ this.custom( this.cur(), dataShow );
+ } else {
+ this.custom( this.prop === "width" || this.prop === "height" ? 1 : 0, this.cur() );
+ }
// Start by showing the element
jQuery( this.elem ).show();
@@ -435,7 +458,7 @@ jQuery.fx.prototype = {
// Simple 'hide' function
hide: function() {
// Remember where we started, so that we can go back to it later
- this.options.orig[ this.prop ] = jQuery.style( this.elem, this.prop );
+ this.options.orig[ this.prop ] = jQuery._data( this.elem, "fxshow" + this.prop ) || jQuery.style( this.elem, this.prop );
this.options.hide = true;
// Begin the animation
@@ -448,7 +471,7 @@ jQuery.fx.prototype = {
done = true,
elem = this.elem,
options = this.options,
- i, n;
+ p, n;
if ( gotoEnd || t >= options.duration + this.startTime ) {
this.now = this.end;
@@ -457,8 +480,8 @@ jQuery.fx.prototype = {
options.animatedProperties[ this.prop ] = true;
- for ( i in options.animatedProperties ) {
- if ( options.animatedProperties[ i ] !== true ) {
+ for ( p in options.animatedProperties ) {
+ if ( options.animatedProperties[ p ] !== true ) {
done = false;
}
}
@@ -479,8 +502,11 @@ jQuery.fx.prototype = {
// Reset the properties, if the item has been hidden or shown
if ( options.hide || options.show ) {
- for ( var p in options.animatedProperties ) {
- jQuery.style( elem, p, options.orig[p] );
+ for ( p in options.animatedProperties ) {
+ jQuery.style( elem, p, options.orig[ p ] );
+ jQuery.removeData( elem, "fxshow" + p, true );
+ // Toggle data is no longer needed
+ jQuery.removeData( elem, "toggle" + p, true );
}
}
@@ -512,7 +538,7 @@ jQuery.fx.prototype = {
jQuery.extend( jQuery.fx, {
tick: function() {
- for ( var timers = jQuery.timers, i = 0 ; i < timers.length ; ++i ) {
+ for ( var timers = jQuery.timers, i = 0; i < timers.length; i++ ) {
if ( !timers[ i ]() ) {
timers.splice(i--, 1);
}
diff --git a/test/unit/effects.js b/test/unit/effects.js
index 864c4a40..5a5a3ec1 100644
--- a/test/unit/effects.js
+++ b/test/unit/effects.js
@@ -660,63 +660,63 @@ test("CSS Overflow and Display", function() {
.animate({ opacity: 0.5 }, "slow", jQuery.checkOverflowDisplay);
});
-jQuery.each( {
- "CSS Auto": function(elem,prop){
- jQuery(elem).addClass("auto" + prop)
- .text("This is a long string of text.");
+jQuery.each({
+ "CSS Auto": function( elem, prop ) {
+ jQuery( elem ).addClass( "auto" + prop )
+ .text( "This is a long string of text." );
return "";
},
- "JS Auto": function(elem,prop){
- jQuery(elem).css(prop,"")
- .text("This is a long string of text.");
+ "JS Auto": function( elem, prop ) {
+ jQuery( elem ).css( prop, "" )
+ .text( "This is a long string of text." );
return "";
},
- "CSS 100": function(elem,prop){
- jQuery(elem).addClass("large" + prop);
+ "CSS 100": function( elem, prop ) {
+ jQuery( elem ).addClass( "large" + prop );
return "";
},
- "JS 100": function(elem,prop){
- jQuery(elem).css(prop,prop == "opacity" ? 1 : "100px");
- return prop == "opacity" ? 1 : 100;
+ "JS 100": function( elem, prop ) {
+ jQuery( elem ).css( prop, prop === "opacity" ? 1 : "100px" );
+ return prop === "opacity" ? 1 : 100;
},
- "CSS 50": function(elem,prop){
- jQuery(elem).addClass("med" + prop);
+ "CSS 50": function( elem, prop ) {
+ jQuery( elem ).addClass( "med" + prop );
return "";
},
- "JS 50": function(elem,prop){
- jQuery(elem).css(prop,prop == "opacity" ? 0.50 : "50px");
- return prop == "opacity" ? 0.5 : 50;
+ "JS 50": function( elem, prop ) {
+ jQuery( elem ).css( prop, prop === "opacity" ? 0.50 : "50px" );
+ return prop === "opacity" ? 0.5 : 50;
},
- "CSS 0": function(elem,prop){
- jQuery(elem).addClass("no" + prop);
+ "CSS 0": function( elem, prop ) {
+ jQuery( elem ).addClass( "no" + prop );
return "";
},
- "JS 0": function(elem,prop){
- jQuery(elem).css(prop,prop == "opacity" ? 0 : "0px");
+ "JS 0": function( elem, prop ) {
+ jQuery( elem ).css( prop, prop === "opacity" ? 0 : "0px" );
return 0;
}
}, function( fn, f ) {
jQuery.each({
- "show": function(elem,prop){
- jQuery(elem).hide().addClass("wide"+prop);
+ "show": function( elem, prop ) {
+ jQuery( elem ).hide( ).addClass( "wide" + prop );
return "show";
},
- "hide": function(elem,prop){
- jQuery(elem).addClass("wide"+prop);
+ "hide": function( elem, prop ) {
+ jQuery( elem ).addClass( "wide" + prop );
return "hide";
},
- "100": function(elem,prop){
- jQuery(elem).addClass("wide"+prop);
+ "100": function( elem, prop ) {
+ jQuery( elem ).addClass( "wide" + prop );
return prop == "opacity" ? 1 : 100;
},
- "50": function(elem,prop){
+ "50": function( elem, prop ) {
return prop == "opacity" ? 0.50 : 50;
},
- "0": function(elem,prop){
- jQuery(elem).addClass("noback");
+ "0": function( elem, prop ) {
+ jQuery( elem ).addClass( "noback" );
return 0;
}
- }, function(tn, t){
+ }, function( tn, t ) {
test(fn + " to " + tn, function() {
var elem = jQuery.makeTest( fn + " to " + tn );
@@ -731,77 +731,82 @@ jQuery.each( {
if ( t_h == "show" ) num++;
if ( t_w == "show" ) num++;
- if ( t_w == "hide"||t_w == "show" ) num++;
- if ( t_h == "hide"||t_h == "show" ) num++;
- if ( t_o == "hide"||t_o == "show" ) num++;
+ if ( t_w == "hide" || t_w == "show" ) num++;
+ if ( t_h == "hide" || t_h == "show" ) num++;
+ if ( t_o == "hide" || t_o == "show" ) num++;
if ( t_w == "hide" ) num++;
if ( t_o.constructor == Number ) num += 2;
if ( t_w.constructor == Number ) num += 2;
if ( t_h.constructor == Number ) num +=2;
- expect(num);
+ expect( num );
stop();
var anim = { width: t_w, height: t_h, opacity: t_o };
elem.animate(anim, 50);
- jQuery.when( elem ).done(function( elem ){
+ jQuery.when( elem ).done(function( elem ) {
elem = elem[ 0 ];
- if ( t_w == "show" )
- equals( elem.style.display, "block", "Showing, display should block: " + elem.style.display);
+ if ( t_w == "show" ) {
+ equals( elem.style.display, "block", "Showing, display should block: " + elem.style.display );
+ }
- if ( t_w == "hide"||t_w == "show" )
- ok(f_w === "" ? elem.style.width === f_w : elem.style.width.indexOf(f_w) === 0, "Width must be reset to " + f_w + ": " + elem.style.width);
+ if ( t_w == "hide" || t_w == "show" ) {
+ ok( f_w === "" ? elem.style.width === f_w : elem.style.width.indexOf( f_w ) === 0, "Width must be reset to " + f_w + ": " + elem.style.width );
+ }
- if ( t_h == "hide"||t_h == "show" )
- ok(f_h === "" ? elem.style.height === f_h : elem.style.height.indexOf(f_h) === 0, "Height must be reset to " + f_h + ": " + elem.style.height);
+ if ( t_h == "hide" || t_h == "show" ) {
+ ok( f_h === "" ? elem.style.height === f_h : elem.style.height.indexOf( f_h ) === 0, "Height must be reset to " + f_h + ": " + elem.style.height );
+ }
var cur_o = jQuery.style(elem, "opacity");
- if ( t_o == "hide" || t_o == "show" )
- equals(cur_o, f_o, "Opacity must be reset to " + f_o + ": " + cur_o);
+ if ( t_o == "hide" || t_o == "show" ) {
+ equals( cur_o, f_o, "Opacity must be reset to " + f_o + ": " + cur_o );
+ }
- if ( t_w == "hide" )
- equals(elem.style.display, "none", "Hiding, display should be none: " + elem.style.display);
+ if ( t_w == "hide" ) {
+ equals( elem.style.display, "none", "Hiding, display should be none: " + elem.style.display );
+ }
if ( t_o.constructor == Number ) {
- equals(cur_o, t_o, "Final opacity should be " + t_o + ": " + cur_o);
+ equals( cur_o, t_o, "Final opacity should be " + t_o + ": " + cur_o );
- ok(jQuery.css(elem, "opacity") != "" || cur_o == t_o, "Opacity should be explicitly set to " + t_o + ", is instead: " + cur_o);
+ ok( jQuery.css(elem, "opacity") != "" || cur_o == t_o, "Opacity should be explicitly set to " + t_o + ", is instead: " + cur_o );
}
if ( t_w.constructor == Number ) {
- equals(elem.style.width, t_w + "px", "Final width should be " + t_w + ": " + elem.style.width);
+ equals( elem.style.width, t_w + "px", "Final width should be " + t_w + ": " + elem.style.width );
- var cur_w = jQuery.css(elem,"width");
+ var cur_w = jQuery.css( elem,"width" );
- ok(elem.style.width != "" || cur_w == t_w, "Width should be explicitly set to " + t_w + ", is instead: " + cur_w);
+ ok( elem.style.width != "" || cur_w == t_w, "Width should be explicitly set to " + t_w + ", is instead: " + cur_w );
}
if ( t_h.constructor == Number ) {
- equals(elem.style.height, t_h + "px", "Final height should be " + t_h + ": " + elem.style.height);
+ equals( elem.style.height, t_h + "px", "Final height should be " + t_h + ": " + elem.style.height );
- var cur_h = jQuery.css(elem,"height");
+ var cur_h = jQuery.css( elem,"height" );
- ok(elem.style.height != "" || cur_h == t_h, "Height should be explicitly set to " + t_h + ", is instead: " + cur_w);
+ ok( elem.style.height != "" || cur_h == t_h, "Height should be explicitly set to " + t_h + ", is instead: " + cur_w );
}
if ( t_h == "show" ) {
- var old_h = jQuery.css(elem, "height");
- jQuery(elem).append("
Some more text
and some more...");
+ var old_h = jQuery.css( elem, "height" );
+ jQuery( elem ).append("
Some more text
and some more...");
if ( /Auto/.test( fn ) ) {
- notEqual(jQuery.css(elem, "height"), old_h, "Make sure height is auto.");
+ notEqual( jQuery.css( elem, "height" ), old_h, "Make sure height is auto." );
} else {
- equals(jQuery.css(elem, "height"), old_h, "Make sure height is not auto.");
+ equals( jQuery.css( elem, "height" ), old_h, "Make sure height is not auto." );
}
}
// manually remove generated element
- jQuery(elem).remove();
+ jQuery( elem ).remove();
start();
});
@@ -809,7 +814,7 @@ jQuery.each( {
});
});
-jQuery.fn.saveState = function(hiddenOverflow){
+jQuery.fn.saveState = function( hiddenOverflow ) {
var check = ["opacity", "height", "width", "display", "overflow"];
expect(check.length);
@@ -817,83 +822,83 @@ jQuery.fn.saveState = function(hiddenOverflow){
return this.each(function(){
var self = this;
self.save = {};
- jQuery.each(check, function(i,c){
- self.save[c] = c === "overflow" && hiddenOverflow ? "hidden" : self.style[ c ] || jQuery.css(self,c);
+ jQuery.each(check, function( i, c ) {
+ self.save[ c ] = c === "overflow" && hiddenOverflow ? "hidden" : self.style[ c ] || jQuery.css( self, c );
});
});
};
-jQuery.checkState = function(){
+jQuery.checkState = function() {
var self = this;
- jQuery.each(this.save, function(c,v){
- var cur = self.style[ c ] || jQuery.css(self, c);
+ jQuery.each(this.save, function( c, v ) {
+ var cur = self.style[ c ] || jQuery.css( self, c );
equals( cur, v, "Make sure that " + c + " is reset (Old: " + v + " Cur: " + cur + ")");
});
// manually clean data on modified element
- jQuery.removeData(this, "olddisplay", true);
+ jQuery.removeData( this, "olddisplay", true );
start();
};
// Chaining Tests
test("Chain fadeOut fadeIn", function() {
- jQuery("#fadein div").saveState().fadeOut("fast").fadeIn("fast",jQuery.checkState);
+ jQuery("#fadein div").saveState().fadeOut("fast").fadeIn("fast", jQuery.checkState );
});
test("Chain fadeIn fadeOut", function() {
- jQuery("#fadeout div").saveState().fadeIn("fast").fadeOut("fast",jQuery.checkState);
+ jQuery("#fadeout div").saveState().fadeIn("fast").fadeOut("fast", jQuery.checkState );
});
test("Chain hide show", function() {
- jQuery("#show div").saveState(jQuery.support.shrinkWrapBlocks).hide("fast").show("fast",jQuery.checkState);
+ jQuery("#show div").saveState( jQuery.support.shrinkWrapBlocks ).hide("fast").show("fast", jQuery.checkState );
});
test("Chain show hide", function() {
- jQuery("#hide div").saveState(jQuery.support.shrinkWrapBlocks).show("fast").hide("fast",jQuery.checkState);
+ jQuery("#hide div").saveState( jQuery.support.shrinkWrapBlocks ).show("fast").hide("fast", jQuery.checkState );
});
test("Chain show hide with easing and callback", function() {
- jQuery("#hide div").saveState().show("fast").hide("fast","linear",jQuery.checkState);
+ jQuery("#hide div").saveState().show("fast").hide("fast","linear", jQuery.checkState );
});
test("Chain toggle in", function() {
- jQuery("#togglein div").saveState(jQuery.support.shrinkWrapBlocks).toggle("fast").toggle("fast",jQuery.checkState);
+ jQuery("#togglein div").saveState( jQuery.support.shrinkWrapBlocks ).toggle("fast").toggle("fast", jQuery.checkState );
});
test("Chain toggle out", function() {
- jQuery("#toggleout div").saveState(jQuery.support.shrinkWrapBlocks).toggle("fast").toggle("fast",jQuery.checkState);
+ jQuery("#toggleout div").saveState( jQuery.support.shrinkWrapBlocks ).toggle("fast").toggle("fast", jQuery.checkState );
});
test("Chain toggle out with easing and callback", function() {
- jQuery("#toggleout div").saveState(jQuery.support.shrinkWrapBlocks).toggle("fast").toggle("fast","linear",jQuery.checkState);
+ jQuery("#toggleout div").saveState( jQuery.support.shrinkWrapBlocks ).toggle("fast").toggle("fast","linear", jQuery.checkState );
});
test("Chain slideDown slideUp", function() {
- jQuery("#slidedown div").saveState(jQuery.support.shrinkWrapBlocks).slideDown("fast").slideUp("fast",jQuery.checkState);
+ jQuery("#slidedown div").saveState( jQuery.support.shrinkWrapBlocks ).slideDown("fast").slideUp("fast", jQuery.checkState );
});
test("Chain slideUp slideDown", function() {
- jQuery("#slideup div").saveState(jQuery.support.shrinkWrapBlocks).slideUp("fast").slideDown("fast",jQuery.checkState);
+ jQuery("#slideup div").saveState( jQuery.support.shrinkWrapBlocks ).slideUp("fast").slideDown("fast", jQuery.checkState );
});
test("Chain slideUp slideDown with easing and callback", function() {
- jQuery("#slideup div").saveState(jQuery.support.shrinkWrapBlocks).slideUp("fast").slideDown("fast","linear",jQuery.checkState);
+ jQuery("#slideup div").saveState( jQuery.support.shrinkWrapBlocks ).slideUp("fast").slideDown("fast","linear", jQuery.checkState );
});
test("Chain slideToggle in", function() {
- jQuery("#slidetogglein div").saveState(jQuery.support.shrinkWrapBlocks).slideToggle("fast").slideToggle("fast",jQuery.checkState);
+ jQuery("#slidetogglein div").saveState( jQuery.support.shrinkWrapBlocks ).slideToggle("fast").slideToggle("fast", jQuery.checkState );
});
test("Chain slideToggle out", function() {
- jQuery("#slidetoggleout div").saveState(jQuery.support.shrinkWrapBlocks).slideToggle("fast").slideToggle("fast",jQuery.checkState);
+ jQuery("#slidetoggleout div").saveState( jQuery.support.shrinkWrapBlocks ).slideToggle("fast").slideToggle("fast", jQuery.checkState );
});
test("Chain fadeToggle in", function() {
- jQuery("#fadetogglein div").saveState().fadeToggle("fast").fadeToggle("fast",jQuery.checkState);
+ jQuery("#fadetogglein div").saveState().fadeToggle("fast").fadeToggle("fast", jQuery.checkState );
});
test("Chain fadeToggle out", function() {
- jQuery("#fadetoggleout div").saveState().fadeToggle("fast").fadeToggle("fast",jQuery.checkState);
+ jQuery("#fadetoggleout div").saveState().fadeToggle("fast").fadeToggle("fast", jQuery.checkState );
});
test("Chain fadeTo 0.5 1.0 with easing and callback)", function() {
- jQuery("#fadeto div").saveState().fadeTo("fast",0.5).fadeTo("fast",1.0,"linear",jQuery.checkState);
+ jQuery("#fadeto div").saveState().fadeTo("fast",0.5).fadeTo("fast",1.0,"linear", jQuery.checkState );
});
jQuery.makeTest = function( text ){
var elem = jQuery("