- From: Simon Fraser <smfr@me.com>
- Date: Tue, 12 Apr 2011 11:33:38 -0700
- To: "L. David Baron" <dbaron@dbaron.org>
- Cc: "Tab Atkins Jr." <jackalmage@gmail.com>, Dean Jackson <dino@apple.com>, www-style@w3.org
On Apr 12, 2011, at 10:29 AM, L. David Baron wrote:
> On Tuesday 2011-04-12 08:56 -0700, Tab Atkins Jr. wrote:
>> On Mon, Apr 11, 2011 at 9:09 PM, L. David Baron <dbaron@dbaron.org> wrote:
>>> (Alternatively, I suppose one could check for whether the property
>>> is specified in any keyframe -- though that's a bit more work.)
>>
>> You need to check all the keyframes. Given a keyframe like this:
>>
>> @keyframes wobble {
>> 0% { left: 0; top: 0; }
>> 33% { top: 100px; }
>> 67% { top: -100px; }
>> 100% { left: 100px; top: 0; }
>> }
>>
>> In the middle third of the animation, the nearest keyframe blocks
>> don't have any mention of 'left', but 'left' is still being animated.
>
> The spec should perhaps mention that somewhere.
Agreed :)
> Additionally, it should say how that behavior interacts with timing
> functions specified in keyframes.
In this case left animates exactly as if the middle two keyframes were missing:
@keyframes wobble {
0% { left: 0; top: 0; }
100% { left: 100px; top: 0; }
}
If the first keyframe had a timing-function, then that's the one that would apply.
In other words, properties are interpolated between the keyframes that specify them.
Simon
Received on Tuesday, 12 April 2011 18:34:39 UTC