mirror of
https://github.com/jquery/jquery.git
synced 2024-11-23 02:54:22 +00:00
Ensure display: inline-block when animating width/height on inline elements. Fixes #14344.
This commit is contained in:
parent
89ddf1040a
commit
812319093a
11
src/effects.js
vendored
11
src/effects.js
vendored
@ -118,7 +118,7 @@ function createTween( value, prop, animation ) {
|
|||||||
|
|
||||||
function defaultPrefilter( elem, props, opts ) {
|
function defaultPrefilter( elem, props, opts ) {
|
||||||
/* jshint validthis: true */
|
/* jshint validthis: true */
|
||||||
var prop, value, toggle, tween, hooks, oldfire,
|
var prop, value, toggle, tween, hooks, oldfire, display, dDisplay,
|
||||||
anim = this,
|
anim = this,
|
||||||
orig = {},
|
orig = {},
|
||||||
style = elem.style,
|
style = elem.style,
|
||||||
@ -161,12 +161,17 @@ function defaultPrefilter( elem, props, opts ) {
|
|||||||
|
|
||||||
// Set display property to inline-block for height/width
|
// Set display property to inline-block for height/width
|
||||||
// animations on inline elements that are having width/height animated
|
// animations on inline elements that are having width/height animated
|
||||||
if ( jQuery.css( elem, "display" ) === "inline" &&
|
display = jQuery.css( elem, "display" );
|
||||||
|
dDisplay = defaultDisplay( elem.nodeName );
|
||||||
|
if ( display === "none" ) {
|
||||||
|
display = dDisplay;
|
||||||
|
}
|
||||||
|
if ( display === "inline" &&
|
||||||
jQuery.css( elem, "float" ) === "none" ) {
|
jQuery.css( elem, "float" ) === "none" ) {
|
||||||
|
|
||||||
// inline-level elements accept inline-block;
|
// inline-level elements accept inline-block;
|
||||||
// block-level elements need to be inline with layout
|
// block-level elements need to be inline with layout
|
||||||
if ( !support.inlineBlockNeedsLayout || defaultDisplay( elem.nodeName ) === "inline" ) {
|
if ( !support.inlineBlockNeedsLayout || dDisplay === "inline" ) {
|
||||||
style.display = "inline-block";
|
style.display = "inline-block";
|
||||||
} else {
|
} else {
|
||||||
style.zoom = 1;
|
style.zoom = 1;
|
||||||
|
10
test/unit/effects.js
vendored
10
test/unit/effects.js
vendored
@ -135,13 +135,17 @@ test("show(Number) - other displays", function() {
|
|||||||
num = 0;
|
num = 0;
|
||||||
jQuery("#test-table").remove();
|
jQuery("#test-table").remove();
|
||||||
|
|
||||||
|
// Note: inline elements are expected to be inline-block
|
||||||
|
// because we're showing width/height
|
||||||
|
// Can't animate width/height inline
|
||||||
|
// See #14344
|
||||||
test = {
|
test = {
|
||||||
"div" : "block",
|
"div" : "block",
|
||||||
"p" : "block",
|
"p" : "block",
|
||||||
"a" : "inline",
|
"a" : "inline-block",
|
||||||
"code" : "inline",
|
"code" : "inline-block",
|
||||||
"pre" : "block",
|
"pre" : "block",
|
||||||
"span" : "inline",
|
"span" : "inline-block",
|
||||||
"table" : old ? "block" : "table",
|
"table" : old ? "block" : "table",
|
||||||
"thead" : old ? "block" : "table-header-group",
|
"thead" : old ? "block" : "table-header-group",
|
||||||
"tbody" : old ? "block" : "table-row-group",
|
"tbody" : old ? "block" : "table-row-group",
|
||||||
|
Loading…
Reference in New Issue
Block a user