diff --git a/css-transforms-1/Overview.bs b/css-transforms-1/Overview.bs index 01324a3a3933..1a130642778c 100644 --- a/css-transforms-1/Overview.bs +++ b/css-transforms-1/Overview.bs @@ -884,98 +884,7 @@ The SVG specification defines the "CSS3 Transitions, CSS3 Animations or SVG Animations if any of those are underway. The computed style and SVG DOM objects of {{animVal}} can not be modified. - -SVG Animation {#svg-animation} -============= - -The <{animate}> and <{set}> element {#svg-animate-element} ------------------------------------ - -With this specification, the <{animate}> element and the <{set}> element can animate the data type <>. - -The animation effect is post-multiplied to the underlying value for additive <{animate}> animations (see below) instead of added to the underlying value, due to the specific behavior of <> animations. - -From-to, from-by and by animations are defined in SMIL to be equivalent to a corresponding values animation. However, to animations are a mixture of additive and non-additive behavior [[SMIL3]]. - -To animations on <{animate}> provide specific functionality to get a smooth change from the underlying value to the to attribute value, which conflicts mathematically with the requirement for additive transform animations to be post-multiplied. As a consequence, the behavior of to animations for <{animate}> is undefined. Authors are suggested to use from-to, from-by, by or values animations to achieve any desired transform animation. - -The value "paced" is undefined for the attribute <{animate/calcMode}> on <{animate}> for animations of the data type <>. If specified, UAs may choose the value "linear" instead. Future versions of this specification may define how paced animations can be performed on <>. - -Note: The following paragraphs extend Elements, attributes and properties that can be animated [[SVG11]]. - -The introduced presentation attributes transform, <{pattern/patternTransform}>, <{linearGradient/gradientTransform}> and 'transform-origin' are animatable. - -With this specification the SVG basic data type <> is equivalent to a list of <>s. <> is animatable and additive. The data type can be animated using the SVG <{animate}> element and the SVG <{set}> element. SVG animations must run the same animation steps as described in section Transitions and Animations between Transform Values. - - - - - - - - - -
Animatable data types
Data type - Additive? - <{animate}> - <{set}> - <{animateColor}> - <{animateTransform}> - Notes - -
<> - yes - yes - yes - no - yes - Additive for <{animateTransform}> means that a transformation is post-multiplied to the base set of transformations. -
- -Neutral element for addition {#neutral-element} ----------------------------- - -Some animations require a neutral element for addition. For transform functions this is a scalar or a list of scalars of 0. Examples of neutral elements for transform functions are ''translate(0)'', ''scale(0)'', ''rotate(0)'', ''skewX(0)'', ''skewY(0)''. - -Note: This paragraph focuses on the requirements of [[SMIL]] and the extension defined by [[SVG11]]. This specification does not provide definitions of neutral elements for the other transform functions than the functions listed above. - -
- -A by animation with a by value vb is equivalent to the same animation with a values list with 2 values, the neutral element for addition for the domain of the target attribute (denoted 0) and vb, and ''additive="sum"''. [[SMIL3]] - -

-<rect width="100" height="100">
-  <animateTransform attributeName="transform" attributeType="XML"
-    type="scale" by="1" dur="5s" fill="freeze"/>
-</rect>
-
- -The neutral element for addition when performing a by animation with ''type="scale"'' is the value 0. Thus, performing the animation of the example above causes the rectangle to be invisible at time 0s (since the animated transform list value is ''scale(0)''), and be scaled back to its original size at time 5s (since the animated transform list value is ''scale(1)''). - -
- -The SVG 1.1 'attributeName' attribute {#svg-attribute-name} -------------------------------------------------------------------------------------------------------- - -SVG 1.1 Animation defines the "attributeName" attribute to specify the name of the target attribute. For the presentation attributes <{linearGradient/gradientTransform}> and <{pattern/patternTransform}> it will also be possible to use the value 'transform'. The same 'transform' property will get animated. - -
- -In this example the gradient transformation of the linear gradient gets animated. - -

-<linearGradient gradientTransform="scale(2)">
-  <animate attributeName="gradientTransform" from="scale(2)" to="scale(4)"
-    dur="3s" additive="sum"/>
-  <animate attributeName="transform" from="translate(0, 0)" to="translate(100px, 100px)"
-    dur="3s" additive="sum"/>
-</linearGradient>
-
- -The <{linearGradient}> element specifies the <{linearGradient/gradientTransform}> presentation attribute. The two <{animate}> elements address the target attribute <{linearGradient/gradientTransform}> and 'transform'. Even so all animations apply to the same gradient transformation by taking the value of the <{linearGradient/gradientTransform}> presentation attribute, applying the scaling of the first animation and applying the translation of the second animation one after the other. - -
+{{animVal}} represents the computed style of the 'transform' property. Therefore it includes all applied CSS3 Transitions, CSS3 Animations or SVG Animations if any of those are underway. The computed style and SVG DOM objects of {{animVal}} can not be modified. The Transform Functions {#transform-functions} ============================================== @@ -1530,6 +1439,7 @@ At this point there are no information about potential privacy or security conce * Relax syntax of transform attribute: Do not require commas between <> items. * Simplified grammar of transform functions. (No normative impact.) +* Remove animation support of 'transform' from animate and set elements. * Editorial changes.

Since the 30 November 2018 Working Draft