- From: Simon Fraser <smfr@me.com>
- Date: Sun, 23 Jan 2011 20:22:56 -0800
- To: Rik Cabanier <cabanier@adobe.com>
- Cc: Alan Gresley <alan@css-class.com>, "Belov, Charles" <Charles.Belov@sfmta.com>, www-style list <www-style@w3.org>
On Jan 23, 2011, at 7:46 PM, Rik Cabanier wrote:
>> The timing of the rotation is easy to achieve if the inner box completes
>> full rotations to be upright (12 o'clock) at the end of it transform
>> where it becomes hidden.
>
> That is exactly the problem.
> What if the translation duration is not a multiple of the rotation duration? It becomes impossible to keep the 2 in sync and you end up having to combine the 2 animations.
> Having 'display' as part of the keyframes would enable this since it will hold the nested animations until the parent animation has 'display: block'
>
>> @-webkit-keyframes move {
>> from { left: 0; visibility: hidden; }
>> 25% { left: 0; visibility: hidden; }
>> to { left: 80%; visibility: visible; }
>> }
>
> Interesting.
> Will the following hide the last keyframe?
> @-webkit-keyframes move {
> from { left: 0; visibility: hidden; }
> 25% { left: 0; visibility: hidden; }
> 50% { left: 80%; visibility: visible; }
> to { left: 80%; visibility: hidden; }
> }
>
> I wonder how 'visibility' is defined to transition...
It's right there in the spec: <http://www.w3.org/TR/css3-transitions/#animation-of-property-types->
Simon
Received on Monday, 24 January 2011 04:23:59 UTC