anim-pattern-href-01.svg

Enable keyboard shortcuts

Checkerboard

<!--

     Any copyright is dedicated to the Public Domain.

     http://creativecommons.org/publicdomain/zero/1.0/

-->

<svg xmlns="http://www.w3.org/2000/svg"

     xmlns:xlink="http://www.w3.org/1999/xlink"

     class="reftest-wait"

     onload="setTimeAndSnapshot(0.5, true)">

  <title>Test animation of the "xlink:href" &lt;string&gt; attribute on the "pattern" element</title>

  <script xlink:href="smil-util.js" type="text/javascript"/>

  <defs>

    <pattern id="pat1a" patternUnits="objectBoundingBox" width="1" height="1">

      <rect width="100%" height="100%" fill="red"/>

    </pattern>

    <pattern id="pat1b" patternUnits="objectBoundingBox" width="1" height="1">

      <rect width="100%" height="100%" fill="lime"/>

    </pattern>

    <pattern id="pat2" xlink:href="#pat1a">

      <animate attributeName="xlink:href"

           begin="0s" dur="1s"

           from="#pat1a" to="#pat1b"/>

    </pattern>

  </defs>

  <rect width="100%" height="100%" fill="lime"/>

  <rect x="20" y="150" width="440" height="80" fill="url(#pat2)" />

</svg>