Bug 27009

Summary: Opacity transition ignored when setting inline style to block
Product: WebKit Reporter: Josh Alley <josh>
Component: CSSAssignee: Nobody <webkit-unassigned>
Status: NEW    
Severity: Minor CC: ahmad.saleem792, ap, bfulgham, dino, graouts, rniwa, simon.fraser
Priority: P2    
Version: 528+ (Nightly build)   
Hardware: Mac (PowerPC)   
OS: OS X 10.5   
Attachments:
Description Flags
Test case none

Josh Alley
Reported 2009-07-06 14:52:04 PDT
Created attachment 32329 [details] Test case Not entirely sure if this is the correct behavior. Apologies if this is the case. Setting an element to display:none and opacity:0, with a transition on opacity, then setting it to display:block and opacity:1 results in the transition being ignored. Expected behavior would be for the element to have its display changed and the element still fade appropriately.
Attachments
Test case (341 bytes, text/html)
2009-07-06 14:52 PDT, Josh Alley 		no flags
Details
View All Add attachment proposed patch, testcase, etc.
Josh Alley
Comment 1 2009-07-08 10:50:59 PDT
Update -- all transitions are ignored in this case. Ex: Set the transition of a div to 'left', change the left value after setting the 'display' style to block.
Simon Fraser (smfr)
Comment 2 2009-08-10 14:16:58 PDT
Yeah, transitions don't run when display is changing from 'none'.
Ahmad Saleem
Comment 3 2022-07-22 11:39:14 PDT
I updated the test case to remove -webkit- prefix to make it easier to test all browsers: Link - https://jsfiddle.net/nwrt6pg5/show All browsers are ignoring "transition" and upon clicking - It is immediate 'TADA' across all (Chrome Canary 105, Firefox Nightly 104 and Safari 15.6 on macOS 12.5). I am not sure on what to expect more, is it something aligned with web-spec or something wrong across all browsers. Just wanted to share updated testing results. Thanks!
Note You need to log in before you can comment on or make changes to this bug.