tor-browser

The Tor Browser
git clone https://git.dasho.dev/tor-browser.git
Log | Files | Refs | README | LICENSE

rotate-animation-on-svg.html (826B)

      1 <!DOCTYPE html>
      2 <html class="reftest-wait">
      3 <head>
      4 <title>Animating the "rotate" property on an SVG element</title>
      5 <link rel="help" href="https://drafts.csswg.org/css-transforms-2/#individual-transforms">
      6 <link rel="match" href="rotate-animation-on-svg-ref.html">
      7 
      8 <style>
      9 
     10 @keyframes rotate-animation {
     11    from { rotate: 0; }
     12    to   { rotate: 180deg; }
     13 }
     14 
     15 svg {
     16    width: 400px;
     17    height: 400px;
     18    overflow: visible;
     19 }
     20 
     21 rect {
     22    width: 100px;
     23    height: 100px;
     24    transform-origin: 100px 100px;
     25    animation: rotate-animation 1ms linear forwards;
     26 }
     27 
     28 </style>
     29 </head>
     30 <body>
     31 <svg><rect></rect></svg>
     32 
     33 <script>
     34 
     35 (async function() {
     36    await Promise.all(document.getAnimations().map(animation => animation.finished));
     37    document.documentElement.classList.remove("reftest-wait");
     38 })();
     39 
     40 </script>
     41 </body>
     42 </html>