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

Re: [css3-transitions] Adding keyframes to transitions

From: Perry Smith <pedzsan@gmail.com>
Date: Wed, 7 Apr 2010 13:25:12 -0500
Cc: www-style list <www-style@w3.org>
Message-Id: <BB94B2D3-BAE9-420E-B63E-814880E3B2AA@gmail.com>
To: Tab Atkins Jr. <jackalmage@gmail.com>

On Apr 7, 2010, at 11:59 AM, Tab Atkins Jr. wrote:

> On Wed, Apr 7, 2010 at 9:43 AM, Perry Smith <pedzsan@gmail.com> wrote:
>> On Apr 7, 2010, at 11:34 AM, Tab Atkins Jr. wrote:
>> .slider > .box {
>>  left: 0;
>>  transition: left 1s play(bounce 1s);
>> }
>> If I understand this right, both would happen at the same time.  We  
>> also
>> need a syntax to have them play sequentially.  Perhaps a comma?
> What's the use case for playing things sequentially?
> I ask not because I don't think it's potentially useful, but to
> hopefully capture a better idea of precisely what the desired behavior
> is, so we can properly solve the use-case.  For example, if we want to
> be able to chain animations arbitrarily, then this sort of thing would
> be best addressed by doing that directly, and perhaps defining some
> way to composite animations together sequentially.  On the other hand,
> if the only useful thing we can find is to play a single animation
> after the transition is done, then this can be done easily by putting
> a delay on the animation equal to the duration of the transition.
>> .slider > .box {
>>  left: 0;
>>  transition: left 1s, play(bounce 1s);
>> }
> That won't work - commas are used to separate multiple transitions.
> The way you have it now would simply define a second, useless
> transition (useless because the default transition-duration is 0,
> which *I think* doesn't cause a transition).

One use case that may be possible now but it appears would be hard is  
simply a sequence of transitions.  My fall back example is a box that  
moves up and then left.  I don't see how to do that with transitions  
even using delays.

Remember that @keyframes are absolute currently so can not really be  
used to define how a transition goes from the current state to the  
final state (without repeating the to and from values inside the  
@keyframes spec.

A sequence of animations (thinking in terms of @keyframes) doesn't  
excite me too much but it probably does other people.

Received on Wednesday, 7 April 2010 18:25:49 UTC

This archive was generated by hypermail 2.4.0 : Friday, 25 March 2022 10:07:44 UTC