| <!DOCTYPE html> |
| <html> |
| <title>SVG Test: Independent Web animations on svg:use instantiation and corresponding element</title> |
| <link rel="help" href="https://svgwg.org/svg2-draft/struct.html#UseElement"> |
| <link rel="match" href="use-element-transitions-ref.html"> |
| <style> |
| use { |
| font-size: 40px; |
| } |
| g { |
| font-size: 120px; |
| } |
| </style> |
| <svg> |
| <use id="use_elm" xlink:href="#tmpl" /> |
| <g id="g_elm"> |
| <text id="tmpl" x="10" y="100">Hello!</text> |
| </g> |
| </svg> |
| <script> |
| tmpl.animate([ |
| { /* starts from computed font-size */ easing: "steps(2, start)"}, |
| { font-size: "80px" } |
| ], 100000); |
| </script> |