anim-filter-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">

  <title>Test animation of the "in" and "result" &lt;string&gt; attributes on "filter" elements</title>

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

  <defs>

    <filter id="filt">

      <feFlood flood-color="red" result="flood1"/>

      <feFlood flood-color="lime" result="nowhere">

        <animate attributeName="result"

                 calcMode="discrete"

                 begin="0s" dur="0.5s"

                 from="nowhere" to="flood2"

                 fill="freeze"/>

      </feFlood>

      <feOffset in="flood1">

        <animate attributeName="in"

                 calcMode="discrete"

                 begin="0s" dur="0.5s"

                 from="flood1" to="flood2"

                 fill="freeze"/>

      </feOffset>

    </filter>

  </defs>

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

  <rect width="100%" height="100%" fill="red" filter="url(#filt)"/>

  <script type="text/javascript">

    function doTest() {

      setTimeAndSnapshot(1, true);

    window.addEventListener("MozReftestInvalidate", doTest, false);

  </script>

</svg>