Opened 16 years ago
Closed 16 years ago
#799 closed bug (fixed)
Setting a CSS height/width then animating a div breaks it
Reported by: | john | Owned by: | |
---|---|---|---|
Priority: | major | Milestone: | 1.1.3 |
Component: | effects | Version: | 1.1.2 |
Keywords: | Cc: | ||
Blocked by: | Blocking: |
Description
For example:
$("<div></div>") .height(300) .width(300) .css("background","black") .appendTo("body");
then do:
$("div").hide("fast")
That works fine, but then try:
$("div").show("fast")
and it completely breaks, it loses all of the styling that was previously set on it.
Change History (5)
comment:1 Changed 16 years ago by
comment:2 Changed 16 years ago by
Again, inline styles are a bad practice and break the flexibility of different media style sheets (like print). Since the width/height is known in this case the other animate methods could be used just as easily. The show and hide remove all the inline styles it can but the other animate methods do not.
comment:4 Changed 16 years ago by
Resolution: | worksforme |
---|---|
Status: | closed → reopened |
I think you guys are missing something - it's completely impossible to hide, then show, any element that has a specific style set. This happens everywhere. Every single DHTML application - case in point: Resizable Windows. Claiming that something "doesn't work in a print stylesheet" is a really strange argument, considering that we're talking about animations here; something that isn't even relevant to print styles or unobtrusive scripting.
The fix is dead simple: whenever a hide is done just revert back to all original inline styles, while setting display to none - it works perfectly. I know that fx use to work that way, but it must've been reverted at some point.
comment:5 Changed 16 years ago by
Milestone: | → 1.1.3 |
---|---|
Resolution: | → fixed |
Status: | reopened → closed |
Version: | → 1.1.2 |
This should be fixed in SVN rev [1531].
Animations would have to store existing inline styles and restore them afterwards.
I guess a valid workaround is to move the styles to a stylesheet and add a class accordingly. Or reapply the modified styles after the animation is completed: