Revision 750785 of SVGAnimatedLength

<div>{{APIRef("SVG")}}</div>

<h2 id="SVG_animated_length_interface">SVG animated length interface</h2>

<p>The <code>SVGAnimatedLength</code> interface is used for attributes of basic type <a href="/en/SVG/Content_type#Length" title="https://developer.mozilla.org/en/SVG/Content_type#Length">&lt;length&gt;</a> which can be animated.</p>

<h3 id="Interface_overview">Interface overview</h3>

<table class="standard-table">
 <tbody>
  <tr>
   <th scope="row">Also&nbsp;implement</th>
   <td><em>None</em></td>
  </tr>
  <tr>
   <th scope="row">Methods</th>
   <td><em>None</em></td>
  </tr>
  <tr>
   <th scope="row">Properties</th>
   <td>
    <ul>
     <li>readonly {{ domxref("SVGLength") }} <code>baseVal</code></li>
     <li>readonly {{ domxref("SVGLength") }} <code>animVal</code></li>
    </ul>
   </td>
  </tr>
  <tr>
   <th scope="row">Normative&nbsp;document</th>
   <td><a class="external" href="https://www.w3.org/TR/SVG11/types.html#InterfaceSVGAnimatedLength" title="https://www.w3.org/TR/SVG11/types.html#InterfaceSVGAnimatedLength">SVG 1.1 (2nd Edition)</a></td>
  </tr>
 </tbody>
</table>

<h2 id="Properties">Properties</h2>

<table class="standard-table">
 <thead>
  <tr>
   <th>Name</th>
   <th>Type</th>
   <th>Description</th>
  </tr>
 </thead>
 <tbody>
  <tr>
   <td><code>baseVal</code></td>
   <td>{{ domxref("SVGLength") }}</td>
   <td>The base value of the given attribute before applying any animations.</td>
  </tr>
  <tr>
   <td><code>animVal</code></td>
   <td>{{ domxref("SVGLength") }}</td>
   <td>If the given attribute or property is being animated, contains the current animated value of the attribute or property. If the given attribute or property is not currently being animated, contains the same value as <code>baseVal</code>.</td>
  </tr>
 </tbody>
</table>

<h2 id="Methods">Methods</h2>

<p>The <code>SVGAnimatedLength</code> interface do not provide any specific methods.</p>

<h2 id="Browser_compatibility" name="Browser_compatibility">Browser compatibility</h2>

<p>{{ CompatibilityTable() }}</p>

<div id="compat-desktop">
<table class="compat-table">
 <tbody>
  <tr>
   <th>Feature</th>
   <th>Chrome</th>
   <th>Firefox (Gecko)</th>
   <th>Internet Explorer</th>
   <th>Opera</th>
   <th>Safari (WebKit)</th>
  </tr>
  <tr>
   <td>Basic support</td>
   <td>{{ CompatUnknown() }}</td>
   <td>{{ CompatUnknown() }}</td>
   <td>{{ CompatUnknown() }}</td>
   <td>{{ CompatUnknown() }}</td>
   <td>{{ CompatUnknown() }}</td>
  </tr>
 </tbody>
</table>
</div>

<div id="compat-mobile">
<table class="compat-table">
 <tbody>
  <tr>
   <th>Feature</th>
   <th>Android</th>
   <th>Firefox Mobile (Gecko)</th>
   <th>IE Mobile</th>
   <th>Opera Mobile</th>
   <th>Safari Mobile</th>
  </tr>
  <tr>
   <td>Basic support</td>
   <td>{{ CompatNo() }}</td>
   <td>{{ CompatUnknown() }}</td>
   <td>{{ CompatUnknown() }}</td>
   <td>{{ CompatUnknown() }}</td>
   <td>{{ CompatUnknown() }}</td>
  </tr>
 </tbody>
</table>
</div>

<p>&nbsp;</p>