Putting different effects in callbacks uses only the first effect.

[chad@…]

I've made this example: ​http://jsfiddle.net/UhEQ6/ In the example there is a link. Clicking it should hide the link, then slide the content into place. Clicking the content should slide it up and then show the link.

Instead what happens is the link is hidden, then the content is shown. Then the content is slid up and the link is slid down. So instead of instant>slide and slide>instant, it does instant>instant and slide>slide

side note: slideDown doesn't seem to work on jsfiddle, but the end result is the same as I get on a normal site where slideDown does work.

[dido]

It seems to be more like instant>instant and slide>instant.

1. The a.alt-toggle element isn't actually being animated, its display property is being toggled between "none" and "inline-block".

2. By calling .hide() on .alt-content on line 15 in your jsfiddle, you set its display property to "none". When slideDown gets called on the element, ​lines 308-312 in the effects module gets skipped which is why it shows instantly. If you inspect the element though, you'll see that the height property is being incremented.

When you try animating inline elements, you're gonna have a bad time. Height and width properties do not apply on inline elements. Your best bet is to use a block-level element for your .alt-content like a <p> or <div>.

There's probably a dupe of this somewhere in the tracker (and likely closed as notabug).

[chad@…]

1. You're right, after extensive testing I've determined it was a trick of the eyes.
2. That code looks like it gets called for both hiding and showing. Since .hide() is only being called once when the document is ready, why does that effect slideDown but not slideUp?

That said, it does work with <div>. <a> version: ​http://jsfiddle.net/UhEQ6/12/ <div> version: ​http://jsfiddle.net/UhEQ6/13/

It still seems like something is amiss to me, though maybe it's only an issue for people who don't know what they're doing.

[Timmy Willison]

This is a bug. We should be accounting for defaultDisplay when animating width/height.

[Timmy Willison]

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

Changeset: 73fe17299a840a8a7f3ffffcac15e32a88bd3d66