This is an archived snapshot of W3C's public bugzilla bug tracker, decommissioned in April 2019. Please see the home page for more details.

Bug 14715 - Clarify interpolation of some transform functions (for transitions/animations)
Summary: Clarify interpolation of some transform functions (for transitions/animations)
Status: RESOLVED FIXED
Alias: None
Product: CSS
Classification: Unclassified
Component: Transforms (show other bugs)
Version: unspecified
Hardware: PC All
: P2 normal
Target Milestone: ---
Assignee: Dirk Schulze
QA Contact:
URL:
Whiteboard:
Keywords:
: 15758 (view as bug list)
Depends on:
Blocks:
 
Reported: 2011-11-07 23:29 UTC by Dean Jackson
Modified: 2012-05-24 20:31 UTC (History)
7 users (show)

See Also:


Attachments
Interpolation of transforms (47.60 KB, patch)
2012-04-30 05:24 UTC, Dirk Schulze
Details
Interpolation of transforms HTML (124.97 KB, text/html)
2012-04-30 05:26 UTC, Dirk Schulze
Details

Comment 1 Dirk Schulze 2012-03-14 23:11:11 UTC
Dean has an action to look at animations of different transform functions. Removing myself for the moment,
Comment 2 Dirk Schulze 2012-03-14 23:12:14 UTC
*** Bug 15758 has been marked as a duplicate of this bug. ***
Comment 3 Dirk Schulze 2012-04-23 17:56:48 UTC
I suggest that we explicitly define the term "same type":

For 2D transforms the same types would be:

translate(), translateX(), translateY() - translate() during animation for computed value
scale(), scaleX(), scaleY() - scale() during animation for computed value
rotate(), rotateZ() - rotate() during animation for computed value
skewX() - skewX() during animation for computed value
skewY() - skewY() during animation for computed value

If one of the engaged transforms is a 3D transform, it will be:

translate3d(), translate(), translateX(), translateY(), translateZ() - translate3D() during animation for computed value
scale3d(), scale(), scaleX(), scaleY(), scaleZ() - scale3d() during animation for computed value
rotate3d(), rotate(), rotateX(), rotateY(), rotateZ() - rotate3d() during animation for computed value (with the exemption of rotate() with three arguments which wouldn't be the same type as the others)

Values can have different units. Therefore in the time during the animation, all values for computed style will fallback to pixel units for <translation-value> values, number units for <number> values and degree units for <angle> values (depending on the type of animation).

This grouping is just based on the assumption that we want to have sensitive output on getting computed style during the animation. The description should go into a new subsection: "Transform function of the same type". I will rephrase it once we reach a consensus on the definition.
Comment 4 Dirk Schulze 2012-04-30 05:24:13 UTC
Created attachment 1125 [details]
Interpolation of transforms

This patch addresses the concerns from Øyvind Stenhaug [1] as well as some concerns raced by Olaf Hoffmann recently that the text should be more generic and just mentions interpolation of two transforms [2].

[1] http://lists.w3.org/Archives/Public/www-style/2011Nov/0107.html
[2] http://lists.w3.org/Archives/Public/www-style/2012Apr/0774.html
Comment 5 Dirk Schulze 2012-04-30 05:26:15 UTC
Created attachment 1126 [details]
Interpolation of transforms HTML

Because it is hard to review the patch, I also added the resulting HTML document. I made changes to the while chapter 15 as well as the term section on the beginning of the document.
Comment 6 Dirk Schulze 2012-05-01 18:54:53 UTC
I add the following description to the term of identity transform:

A special case is perspective: '<code class="css">perspective(infinity)</code>'. The value of m<small>34</small> becomes infinitesimal small and the transform function is therefore assumed to be equal to the identity matrix.
Comment 7 Dirk Schulze 2012-05-02 05:17:48 UTC
Committed the change. Keep this bug open for some days till we proved that this is enough.
Comment 8 Dirk Schulze 2012-05-24 20:31:50 UTC
Interpolation of transforms is independent of certain terms in CSS animations and CSS transitions now. Detailed descriptions and examples say how to interpolate between different transform functions.