tor-browser

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

clip-text-dynamic-2.html (1056B)


      1 <!doctype html>
      2 <html class="reftest-wait">
      3 <title>CSS Test: background-clip: text is invalidated properly on text position changes</title>
      4 <link rel="help" href="https://drafts.csswg.org/css-backgrounds-4/#valdef-background-clip-text">
      5 <link rel="help" href="https://bugzilla.mozilla.org/show_bug.cgi?id=1525372">
      6 <link rel="author" href="mailto:mwoodrow@mozilla.com" title="Matt Woodrow">
      7 <link rel="author" href="https://mozilla.org" title="Mozilla">
      8 <link rel="match" href="clip-text-dynamic-2-ref.html">
      9 <style>
     10  .text {
     11    background-color: blue;
     12    color: transparent;
     13    font: 50px/1 monospace;
     14    background-clip: text;
     15    height: 200px;
     16  }
     17  .prev {
     18    height: 10px;
     19  }
     20  p {
     21    color: transparent;
     22  }
     23 </style>
     24 <div class="text">
     25  <div class="prev"></div>
     26  <div class="inner">
     27    <p>XxX</p>
     28  </div>
     29 </div>
     30 <script>
     31 onload = () => {
     32  requestAnimationFrame(() => {
     33    requestAnimationFrame(() => {
     34      document.querySelector(".prev").style.height = "100px";
     35      document.documentElement.className = "";
     36    })
     37  })
     38 }
     39 </script>