W3C home > Mailing lists > Public > www-style@w3.org > April 2012

Re: [css3-transitions] Transitions from display:none

From: Boris Zbarsky <bzbarsky@MIT.EDU>
Date: Tue, 17 Apr 2012 22:31:31 -0400
Message-ID: <4F8E2783.5020108@mit.edu>
To: James Robinson <jamesr@google.com>
CC: "Tab Atkins Jr." <jackalmage@gmail.com>, Sylvain Galineau <sylvaing@microsoft.com>, "www-style@w3.org" <www-style@w3.org>
On 4/17/12 10:23 PM, James Robinson wrote:
> More specifically when queueing the task the browser has to store the
> "before" computed value of the animatable/transitionable property and
> then keep that around until the task runs.

Yeah, ok.

>         Concretely with this proposal in Sylvain's example the
>         transition would
>         not occur in either of the scenarios he mentions:
>         e.style.color = "blue";
>         e.style.display = "block";
>     Why would there be no transition in this case?
> As a reminder, the initial state here is:
> E { display:none; color:red; transition: color 0.25s; }
> and I'm assuming that after each statement the browser may or may not
> resolve styles.  Regardless of when that happens, at some point the
> browser queues a task.  When the task runs it evaluates that the
> computed value for "color" is "blue" and was previously not specified,
> since there was no CSS box.

That's certainly not the case universally in UAs.  As a trivial example, 
no CSS box might still mean there was a known computed _display_ style 
("none", to be precise).  Depending on the UA, other styles might have 
been computed too.

We could get this behavior if we _required_ that the "before" value be 
stored as "not computed" if there is no CSS box, but it's not obvious a 
priori that this would be the behavior.

But even that wouldn't guarantee the behavior you want in this case: the 
UA might flush out recomputation of display, discover that a box is 
needed and create one before it ever computes a color for that box. 
Gecko doesn't do this right now, but nothing currently prevents it.

> A similar argument applies for an initial state of display:block; color:
> blue and the JS
> e.style.color = "red";
> e.style.display = "none";
> when the task runs the element has no CSS box, so no transition.

Again, that's not obvious to me; I think you're assuming details of 
style system implementation here....

Received on Wednesday, 18 April 2012 02:32:01 UTC

This archive was generated by hypermail 2.4.0 : Friday, 25 March 2022 10:08:14 UTC