Re: [css3-2d-transforms] Interpolation of transforms (for transitions/animations)

On Fri, Nov 4, 2011 at 8:59 AM, Øyvind Stenhaug <> wrote:
> or
> and also
> This section gives rules for interpolating transform values for
> transition/animation purposes. However, it is unclear on some points.
> 1) A couple of points are conditional on functions being "of the same type".
> It is not clear what "type" means. E.g.:
>   a) Is translate(20px) the same type as translate(40px, 40px)?
>   b) translate(20px) and translateX(20px)?
>   c) translate(20px) and translate(80%)?

It's probably supposed to mean "with the same function name".  It's
underspecified, though.  With that assumption:

(a) is definitely the same, since the 1-argument form explains the
default value of the omitted argument.
(b) *should* be the same, but the current spec probably disallows it.
translateX/Y should be treated as just a translate function with the
appropriate argument being 0.
(c) is definitely the same.

> 2) Even assuming that having the "same type" simply means having identical
> FUNCTION tokens and the same number of parameters, we end up at "the
> individual components of the function are interpolated numerically", which
> doesn't make sense unless each pair of "components" have matching units.

Right; they should be interpreted as lengths, numbers, or angles, as
appropriate.  We can interpolate lengths with different units without
problem, though some cases require representing it with calc().

> 3) Even if considering parameters with different units to result in
> functions being different "type", the "Otherwise" step says to convert to
> matrix values. But transitions/animations operate on computed values, and
> percentages cannot be resolved at this level (they depend on used values).

Yes, this can't be done in general at computed-value time.  Instead,
these transforms should be represented using whatever mechanism we
decide on for interpolating other types of values that can't be done
without used-time values, like going from "height:auto" to
"height:0px".  Then this section can specify how that is actually


Received on Friday, 4 November 2011 19:40:00 UTC