tor-browser

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

position-fixed-dynamic-transformed-sibling.html (1006B)

      1 <!doctype html>
      2 <meta charset=utf-8>
      3 <meta name="viewport" content="width=device-width">
      4 <link rel="match" href="position-fixed-dynamic-transformed-sibling-ref.html">
      5 <link rel="help" href="https://drafts.csswg.org/css-position/#fixed-pos">
      6 <link rel="help" href="https://bugzil.la/1797703">
      7 <link rel="author" href="mailto:emilio@crisal.io" title="Emilio Cobos Álvarez">
      8 <link rel="author" href="https://mozilla.org" title="Mozilla">
      9 <style>
     10  body {
     11    margin: 0;
     12  }
     13  .spacer {
     14    height: 100px;
     15  }
     16  .transformed {
     17    transform: translateX(0);
     18  }
     19  .fixed {
     20    position: fixed;
     21    top: 0;
     22    left: 0;
     23    width: 100%;
     24    height: 50px;
     25    background-color: blue;
     26  }
     27  #target {
     28    position: relative;
     29  }
     30 </style>
     31 <div class="spacer"></div>
     32 <div id="target" style="display: none">
     33  <div class="transformed"></div>
     34  <div class="fixed"></div>
     35 </div>
     36 <script>
     37  let target = document.getElementById("target");
     38  document.body.getBoundingClientRect();
     39  target.style.display = "";
     40 </script>