additive

  • Revision slug: Web/SVG/Attribute/additive
  • Revision title: additive
  • Revision id: 427159
  • Created:
  • Creator: Jeremie
  • Is current revision? Yes
  • Comment page created, 160 words addedMoved From SVG/Attribute/additive to Web/SVG/Attribute/additive

Revision Content

« SVG Attribute reference home

This attribute controls whether or not the animation is additive.

It is frequently useful to define animation as an offset or delta to an attribute's value, rather than as absolute values. This attribute said to the animation if their values are added to the original animated attribute's value.

Usage context

Categories Animation addition attribute
Value replace | sum
Animatable No
Normative document SVG 1.1 (2nd Edition)
sum
Specifies that the animation will add to the underlying value of the attribute and other lower priority animations.
replace
Specifies that the animation will override the underlying value of the attribute and other lower priority animations. This is the default, however the behavior is also affected by the animation value attributes {{ SVGAttr("by") }} and {{ SVGAttr("to") }}, as described in SMIL Animation: How from, to and by attributes affect additive behavior.

Example

Elements

The following elements can use the additive attribute

  • {{ SVGElement("animate") }}
  • {{ SVGElement("animateColor") }}
  • {{ SVGElement("animateMotion") }}
  • {{ SVGElement("animateTransform") }}

Revision Source

<p>« <a href="/en/SVG/Attribute" title="en/SVG/Attribute">SVG Attribute reference home</a></p>
<p>This attribute controls whether or not the animation is additive.</p>
<p>It is frequently useful to define animation as an offset or delta to an attribute's value, rather than as absolute values. This attribute said to the animation if their values are added to the original animated attribute's value.</p>
<h2 id="Usage_context">Usage context</h2>
<table class="standard-table"> <tbody> <tr> <th scope="row">Categories</th> <td>Animation addition attribute</td> </tr> <tr> <th scope="row">Value</th> <td><strong title="this is the default value">replace</strong> | sum</td> </tr> <tr> <th scope="row">Animatable</th> <td>No</td> </tr> <tr> <th scope="row">Normative document</th> <td><a class="external" href="http://www.w3.org/TR/SVG/animate.html#AdditionAttributes" title="http://www.w3.org/TR/SVG/animate.html#AdditionAttributes">SVG 1.1 (2nd Edition)</a></td> </tr> </tbody>
</table>
<dl> <dt>sum</dt> <dd>Specifies that the animation will add to the underlying value of the attribute and other lower priority animations.</dd> <dt>replace</dt> <dd>Specifies that the animation will override the underlying value of the attribute and other lower priority animations. This is the default, however the behavior is also affected by the animation value attributes {{ SVGAttr("by") }} and {{ SVGAttr("to") }}, as described in <a class="external" href="http://www.w3.org/TR/2001/REC-smil-animation-20010904/#FromToByAndAdditive" title="http://www.w3.org/TR/2001/REC-smil-animation-20010904/#FromToByAndAdditive">SMIL Animation: How from, to and by attributes affect additive behavior</a>.</dd>
</dl>
<h2 id="Example">Example</h2>
<h2 id="Elements">Elements</h2>
<p>The following elements can use the <code>additive</code> attribute</p>
<ul> <li>{{ SVGElement("animate") }}</li> <li>{{ SVGElement("animateColor") }}</li> <li>{{ SVGElement("animateMotion") }}</li> <li>{{ SVGElement("animateTransform") }}</li>
</ul>
Revert to this revision