@@ -3079,57 +3079,6 @@ to the property's specified {{PropertyDescriptor/syntax}}
30793079or when the <a>custom property</a> is not registered,
30803080the <a>animation type</a> is <a>discrete</a> .
30813081
3082- <h4 id="transform-list-animation-type-section">Transform list</h4>
3083-
3084- A property whose <a>animation type</a> is <dfn
3085- lt="transform list animation type"> transform list</dfn> has the following
3086- behavior:
3087-
3088- * <a lt="interpolation">interpolation</a> :
3089- as defined in <a
3090- href="https://www.w3.org/TR/css-transforms-1/#interpolation-of-transforms"> Interpolation
3091- of Transforms</a> [[CSS3-TRANSFORMS]] .
3092-
3093- * <a lt="value addition">addition</a> : performed by
3094- concatenating transform lists as
3095- ‘<var> V</var><sub> a</sub> <var> V</var><sub> b</sub> ’.
3096-
3097- * <a lt="value accumulation">accumulation</a> :
3098-
3099- 1. Beginning at the end of each list, <var> V</var><sub> a</sub>
3100- and <var> V</var><sub> b</sub> ,
3101- find the largest contiguous portion of each list where the
3102- corresponding list elements from each list have the same
3103- transform type.
3104- Call the matching portions from <var> V</var><sub> a</sub> and
3105- <var> V</var><sub> b</sub> , <var> V</var><sub> matching-a</sub>
3106- and
3107- <var> V</var><sub> matching-b</sub> respectively and likewise
3108- <var> V</var><sub> remainder-a</sub> and
3109- <var> V</var><sub> remainder-b</sub> for the non-matching
3110- parts.
3111- <p class="issue">
3112- We should probably expand 2d functions to their 3d
3113- equivalents before matching?
3114- </p>
3115- 2. Let <var> V</var><sub> combined</sub> be a transform list
3116- combining <var> V</var><sub> matching-a</sub> and
3117- <var> V</var><sub> matching-b</sub> by adding the numeric
3118- components of each corresponding function.
3119- <p class="issue">
3120- This needs to be more specific, e.g. when combining
3121- <code> translate(20px)</code> and <code> translate(30px
3122- 10px)</code> we have to expand the first function to
3123- <code> translate(20px 0px)</code> first.
3124- Probably need to define unit conversion too.
3125- </p>
3126- 3. The result of accumulation is a transform list created by <a
3127- lt="value addition"> adding</a> the combined result
3128- with the non-matching portions of the two lists as follows:
3129- ‘<var> V</var><sub> remainder-a</sub>
3130- <var> V</var><sub> remainder-b</sub>
3131- <var> V</var><sub> combined</sub> ’.
3132-
31333082
31343083<h3 id="keyframe-effects">Keyframe effects</h3>
31353084
0 commit comments