<animateTransform>
<animate>
<animatecolor>
<animatemotion>
<animatetransform>
<discard>
<mpath>
<set>
SVG Elements
- A
- B-C
- D
- E
- F
<feBlend>
<feColorMatrix>
<feComponentTransfer>
<feComposite>
<feConvolveMatrix>
<feDiffuseLighting>
<feDisplacementMap>
<feDistantLight>
<feFlood>
<feFuncA>
<feFuncB>
<feFuncG>
<feFuncR>
<feGaussianBlur>
<feImage>
<feMerge>
<feMergeNode>
<feMorphology>
<feOffset>
<fePointLight>
<feSpecularLighting>
<feSpotLight>
<feTile>
<feTurbulence>
<filter>
<font>
<font-face>
<font-face-format>
<font-face-name>
<font-face-src>
<font-face-uri>
<foreignObject>
- G
- H
- I
- J-L
- M
- N-P
- Q-R
- S
- T
- U
- V-Z
The animateTransform
element animates a transformation attribute on its target element, thereby allowing animations to control translation, scaling, rotation, and/or skewing.
Usage context
Categories | Animation element |
---|---|
Permitted content | Any number of the following elements, in any order: Descriptive elements |
Example
<svg width="120" height="120" viewBox="0 0 120 120"
xmlns="http://www.w3.org/2000/svg">
<polygon points="60,30 90,90 30,90">
<animateTransform attributeName="transform"
attributeType="XML"
type="rotate"
from="0 60 70"
to="360 60 70"
dur="10s"
repeatCount="indefinite"/>
</polygon>
</svg>
Live sample
Attributes
Global attributes
Specific attributes
DOM Interface
This element implements the SVGAnimateTransformElement
interface.
Specifications
Specification |
---|
SVG Animations Level 2 # AnimateTransformElement |
Browser compatibility
BCD tables only load in the browser