W3cubDocs

/SVG

<animatetransform>

The animateTransform element animates a transformation attribute on a 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

<?xml version="1.0"?>
<svg width="120" height="120"  viewBox="0 0 120 120"
     xmlns="http://www.w3.org/2000/svg" version="1.1"
     xmlns:xlink="http://www.w3.org/1999/xlink" >

    <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

Browser compatibility

Feature Chrome Firefox (Gecko) IE Opera Safari
Basic support (Yes) (Yes) No support (Yes) ?
Feature Android Firefox Mobile (Gecko) IE Phone Opera Mobile Safari Mobile
Basic support ? ? ? ? ?

© 2005–2017 Mozilla Developer Network and individual contributors.
Licensed under the Creative Commons Attribution-ShareAlike License v2.5 or later.
https://developer.mozilla.org/en-US/docs/Web/SVG/Element/animateTransform