W3C home > Mailing lists > Public > www-style@w3.org > February 2013

Re: [css-transitions] starting of transitions.

From: Tab Atkins Jr. <jackalmage@gmail.com>
Date: Wed, 20 Feb 2013 20:04:28 -0800
Message-ID: <CAAWBYDCvbhCxzTJQZkG0sGESRqaf=H3TDm+OBtwt9kbPQPmt2Q@mail.gmail.com>
To: Andrew Fedoniouk <news@terrainformatica.com>
Cc: "www-style@w3.org" <www-style@w3.org>
On Wed, Feb 20, 2013 at 7:54 PM, Andrew Fedoniouk
<news@terrainformatica.com> wrote:
> I've the question reading this section
> http://www.w3.org/TR/css3-transitions/#starting
>
> Let's assume I have these two rules:
>
> a:link { color:red; transition: color 1s linear; }
> a:link:hover { color:blue; transition: color 2s ease;  }
>
> so there are two types of animations: for entering :hover state
> and leaving it.
>
> Question is: what timing function will be used when
> <a> gets :hover state? And the same one for :not(:hover) state.

The one that applies in the new-value state.  red->blue will be "2s
ease", blue->red will be "1s linear".

> The section above in my opinion is not clear enough on this.

The spec says exactly what I said above:

"When the computed value of an animatable property changes,
implementations must decide what transitions to start based on the
values of the ‘transition-property’, ‘transition-duration’,
‘transition-timing-function’, and ‘transition-delay’ properties at the
time the animatable property would first have its new computed value."

Additionally, there's an example below that sentence illustrating an
identical case to the one you posted, which explains exactly what the
intended effect is.

~TJ
Received on Thursday, 21 February 2013 04:05:18 GMT

This archive was generated by hypermail 2.3.1 : Tuesday, 26 March 2013 17:21:06 GMT