Bug Tracker

#11303 closed bug (invalid)

Opened February 07, 2012 09:19PM UTC

Closed February 08, 2012 09:11AM UTC

Last modified May 11, 2013 06:48AM UTC

FadeIn doesn't keep block format

Reported by: ryannaddy Owned by:
Priority: low Milestone: None
Component: effects Version: 1.7.1
Keywords: Cc:
Blocked by: Blocking:
Description

While using fadeIn() on an <a> tag with a css "block" display type, it removes the block format when it fades in. It seems to do the same on other inline elements as well. It works fine on the <div> tag though.

Example:

http://jsfiddle.net/NZ3eF/1/

Attachments (0)
Change History (2)

Changed February 08, 2012 09:11AM UTC by sindresorhus comment:1

component: unfiled → effects
priority: undecided → low
resolution: → invalid
status: new → closed

Simplified testcase: http://jsfiddle.net/mofle/NZ3eF/3/

The problem is that you have a rule "display: none" after "display: block" which overwrites it. Since the display value is none, jQuery will instead use the default display value of the a-tag, which is "inline".

You can work around this by doing something like this instead:

$('.nav-link').fadeIn().css('display', 'block');

Changed May 11, 2013 06:48AM UTC by Sagan Internet Marketing comment:2

Thanks for the idea to use

.css('display', 'block');