Opened 12 years ago
Closed 11 years ago
#5201 closed bug (notabug)
Hover + backgroundColor animation fails to update viewport in IE8
Reported by: | Kanuck | Owned by: | Kanuck |
---|---|---|---|
Priority: | minor | Milestone: | 1.9.0 |
Component: | ui.effects.core | Version: | 1.7.2 |
Keywords: | Cc: | ||
Blocked by: | Blocking: |
Description
I am using animate()
to change a background colour. Here is the relevant snippet:
.hover(function() { $(this).find("a") .stop().animate({'backgroundColor' : '#DCDDDF'}, 100); }, function() { $(this).find("a") .stop().animate({'backgroundColor' : '#F2F2F3'}, 250); })
Unfortunately, in IE8—and only IE8—the effect does not work.
The value of background-color is being changed in the DOM, but the viewport isn't being updated; as soon as any other animation effect kicks in, the viewport updates.
I think the bug is in the UI effects core because changing backgroundColor
to, say, opacity
eliminates the issue. Animating opacity
is handled by jQuery natively, whereas animating backgroundColor
is handled by jQuery UI.
I've found a workaround that might shine some light on an eventual fix: chaining .fadeTo(1, 1)
in front of the first stop()
gives the renderer the kick in the pants it needs to work correctly. I expect it's causing core jQuery to do something necessary that jQuery UI is failing to do.
IE8 affected. IE7 mode, IE7, IE6, Safari, Firefox, Chrome all immune.
Change History (5)
comment:1 Changed 12 years ago by
comment:2 Changed 12 years ago by
Milestone: | TBD → 1.8 |
---|
comment:3 Changed 11 years ago by
Owner: | set to Kanuck |
---|---|
Status: | new → pending |
http://jsfiddle.net/gnarf/vK3bA/ I used this url to test and did not see this bug in IE8... Do you have a different test case, or is this bug not affecting 1.8.9?
comment:4 Changed 11 years ago by
Priority: | major → minor |
---|
comment:5 Changed 11 years ago by
Resolution: | → invalid |
---|---|
Status: | pending → closed |
Because we get so many tickets, we often need to return them to the initial reporter for more information. If that person does not reply within 14 days, the ticket will automatically be closed, and that has happened in this case. If you still are interested in pursuing this issue, feel free to add a comment with the requested information and we will be happy to reopen the ticket if it is still valid. Thanks!
Ah yes, I almost forgot to mention: changing
.hover()
to.click()
also eliminates the problem, so it seems to be something particular to the interaction betweenhover()
andanimate()
.