Effects: Respect display value on inline elements

Take "olddisplay" value into the account

Fixes #14824
Closes gh-1566
Ref 73fe17299a840a8a7f3ffffcac15e32a88bd3d66

diff --git a/src/effects.js b/src/effects.js
index 69d1effc5deb1dbbf73c3a933ca3f66fdf66ca91..5fafc528c761047980a003381769880cbaea9aef 100644 (file)
--- a/src/effects.js
+++ b/src/effects.js
@@ -116,7 +116,7 @@ function createTween( value, prop, animation ) {
 
 function defaultPrefilter( elem, props, opts ) {
        /* jshint validthis: true */
-       var prop, value, toggle, tween, hooks, oldfire, display,
+       var prop, value, toggle, tween, hooks, oldfire, display, checkDisplay,
                anim = this,
                orig = {},
                style = elem.style,
@@ -160,10 +160,12 @@ function defaultPrefilter( elem, props, opts ) {
                // Set display property to inline-block for height/width
                // animations on inline elements that are having width/height animated
                display = jQuery.css( elem, "display" );
+
                // Test default display if display is currently "none"
-               if ( (display === "none" ? defaultDisplay( elem.nodeName ) : display) === "inline" &&
-                               jQuery.css( elem, "float" ) === "none" ) {
+               checkDisplay = display === "none" ?
+                       data_priv.get( elem, "olddisplay" ) || defaultDisplay( elem.nodeName ) : display;
 
+               if ( checkDisplay === "inline" && jQuery.css( elem, "float" ) === "none" ) {
                        style.display = "inline-block";
                }
        }

diff --git a/test/data/testsuite.css b/test/data/testsuite.css
index d4122643c17550cc04f0b8086de3f67804c715df..cf2ba8c205b1eba22849c402cbac2c4030f8f801 100644 (file)
--- a/test/data/testsuite.css
+++ b/test/data/testsuite.css
@@ -138,4 +138,7 @@ section { background:#f0f; display:block; }
 /* #11971 */
 #foo { background: url(1x1.jpg) right bottom no-repeat; }
 
+/* #14824 */
+#span-14824 { display: block; }
+
 #display { display: list-item !important; }

diff --git a/test/unit/effects.js b/test/unit/effects.js
index 15e67ec1a2fe46b5f471f42867b43a8d997a3ece..ceef87afee070beeca5d619e12be83c4c354f422 100644 (file)
--- a/test/unit/effects.js
+++ b/test/unit/effects.js
@@ -2158,4 +2158,28 @@ test( "slideDown() after stop() (#13483)", 2, function() {
                clock.tick( 10 );
 });
 
+test( "Respect display value on inline elements (#14824)", 2, function() {
+       var clock = this.clock,
+               fromStyleSheet = jQuery( "<span id='span-14824' />" ),
+               fromStyleAttr = jQuery( "<span style='display: block;' />" );
+
+       jQuery( "#qunit-fixture" ).append( fromStyleSheet, fromStyleAttr );
+
+       fromStyleSheet.slideUp(function() {
+               jQuery( this ).slideDown( function() {
+                       equal( jQuery( this ).css( "display" ), "block",
+                               "Respect previous display value (from stylesheet) on span element" );
+               });
+       });
+
+       fromStyleAttr.slideUp( function() {
+               jQuery( this ).slideDown( function() {
+                       equal( jQuery( this ).css( "display" ), "block",
+                               "Respect previous display value (from style attribute) on span element" );
+               });
+       });
+
+       clock.tick( 800 );
+});
+
 })();