RE: [css-props-vals] First iteration of L1 spec

> >>> As you noted, if I want to animate the location of an object on the
> >>> screen, I can use “transform” which transitions perfectly fine. The
> >>> issue is that the “apply” hook will be run *after* transitions
> >>> already took place. So, any change I’ll make to “transform” in the
> >>> hook cannot possibly rely on the “transition” property to animate.
> >>
> >> Unless the changes are themselves driven by a transition, in which
> >> case everything should work fine because apply will be called on each
> frame.
> >
> > Give this a second thought. I understand you don't like my more complex
> cases, but imagine simple cases like :
> >
> >     #element { --border-width: 3px; --border-color: blue; transition: --
> border-width 3s; }
> >     #element:hover { --border: 5px green; }
> >
> > How can I (in the apply hook of "--border") trigger a transition of "--border-
> width"?
> 
> You just set --border-width/etc, no?

Well, if I understood correctly, Share and you told me that if "--first-number" does transition, then the "apply" hook computing "--both-numbers = --first-number + --second-number" will run at every frame [*], with the current value of "--first-number" every time. 

That means transition are already run at that point. This means I can't set "--border-width" and hope to see the browser start a transition, because he can't know if I want to actually do this or if the "--border-width" value I set is already the result of a computation resulting from the ongoing transitions.

Right?



[*] "Unless the changes are themselves driven by a transition, in which case everything should work fine because apply will be called on each frame" (Shane)

Received on Monday, 22 June 2015 20:41:55 UTC