library-mirrors/jquery
1
0
Fork 0
mirror of https://github.com/jquery/jquery.git synced 2025-01-10 18:24:24 +00:00
Code Issues Actions 1 Packages Projects Releases Wiki Activity

Ensure display: inline-block when animating width/height on inline elements. Fixes #14344.

Browse Source
This commit is contained in:
Timmy Willison 2013-09-10 14:57:14 -05:00
parent ac60f1071d
commit 73fe17299a
2 changed files with 17 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

13
src/effects.js vendored
View File

@ -5,7 +5,9 @@ var
pnum = require( "./var/pnum" ), pnum = require( "./var/pnum" ),
cssExpand = require( "./css/var/cssExpand" ), cssExpand = require( "./css/var/cssExpand" ),
isHidden = require( "./css/var/isHidden" ), isHidden = require( "./css/var/isHidden" ),
defaultDisplay = require( "./css/defaultDisplay" ),
data_priv = require( "./data/var/data_priv" ), data_priv = require( "./data/var/data_priv" ),
fxNow, timerId, fxNow, timerId,
rfxtypes = /^(?:toggle|show|hide)$/, rfxtypes = /^(?:toggle|show|hide)$/,
rfxnum = new RegExp( "^(?:([+-])=|)(" + pnum + ")([a-z%]*)$", "i" ), rfxnum = new RegExp( "^(?:([+-])=|)(" + pnum + ")([a-z%]*)$", "i" ),
@ -86,7 +88,7 @@ function genFx( type, includeWidth ) {
// if we include width, step value is 1 to do all cssExpand values, // if we include width, step value is 1 to do all cssExpand values,
// if we don't include width, step value is 2 to skip over Left and Right // if we don't include width, step value is 2 to skip over Left and Right
includeWidth = includeWidth? 1 : 0; includeWidth = includeWidth ? 1 : 0;
for( ; i < 4 ; i += 2 - includeWidth ) { for( ; i < 4 ; i += 2 - includeWidth ) {
which = cssExpand[ i ]; which = cssExpand[ i ];
attrs[ "margin" + which ] = attrs[ "padding" + which ] = type; attrs[ "margin" + which ] = attrs[ "padding" + which ] = type;
@ -115,7 +117,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,
anim = this, anim = this,
orig = {}, orig = {},
style = elem.style, style = elem.style,
@ -158,7 +160,12 @@ 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" );
// Get default display if display is currently "none"
if ( display === "none" ) {
display = defaultDisplay( elem.nodeName );
}
if ( display === "inline" &&
jQuery.css( elem, "float" ) === "none" ) { jQuery.css( elem, "float" ) === "none" ) {
style.display = "inline-block"; style.display = "inline-block";

10
test/unit/effects.js vendored
View File

@ -131,13 +131,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",