Re: [css-animations] Specifying how keyframes interact

>
> Side note: one of the ideas here was to allow a smooth animation between
> various keyframes. However, this is extremely difficult to hand-author,
> because any change in the keyframe duration (i.e. keyframe %) means you
> need to adjust the timing functions both earlier and later. It might be
> nice to have a timing function that tells the engine to smooth the
> animation.
>

The web animations spec has this! (specifically, a global timing function
that extends across the animation rather than between keyframes)

I'd love to see it in CSS too as it's really useful. I suppose we'd need a
new animation-global-timing-function property or similar? Updating the
shorthand would be .. interesting .. too.

Cheers,
    -Shane


>
> Dean
>
>
> >      Append the transition endpoint to the list of transition endpoints.
> >
> > Divide the list of transition endpoints into a number of independent
> > lists according to the property associated with the endpoint,
> > maintaining the relative order.
> >
> > Stably sort each list by the selector of each endpoint.  If the same
> > selector occurs multiple times in a list, discard all but the last.
> > If a list doesn't have a 0% endpoint, add one with the underlying
> > value of the property from the element and the default timing function
> > from the 'animation' property invoking the animation.  Do the same if
> > a list doesn't have a 100% endpoint.
> >
> > Create a list of transitions, initially empty.
> > For each list of transition endpoint:
> >  For each overlapping pair¹ of transition endpoints in the list:
> >    Create a property transition for the property, with the start time
> > and value from the first transition endpoint, end time and value from
> > the second transition endpoint, and timing function from the first
> > transition endpoint.
> >    Append the property transition to the list of transitions.
> >
> > The list of transitions thus produced defines the animation.
> >
> > ¹ That is, if the the list contains [1, 2, 3, 4], produce the pairs
> > [1, 2], [2, 3], [3, 4].
> >
> > ~TJ
> >
>
>
>