tor-browser

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

scroll-padding-affects-anchoring.html (990B)

      1 <!DOCTYPE html>
      2 <title>scroll anchoring accounts for scroll-padding</title>
      3 <link rel="author" href="mailto:emilio@crisal.io" title="Emilio Cobos Álvarez">
      4 <link rel="author" href="https://mozilla.org" title="Mozilla">
      5 <link rel="help" href="https://drafts.csswg.org/css-scroll-anchoring/#anchor-node-selection">
      6 <link rel="help" href="https://drafts.csswg.org/css-scroll-snap-1/#optimal-viewing-region">
      7 <script src="/resources/testharness.js"></script>
      8 <script src="/resources/testharnessreport.js"></script>
      9 <style>
     10  #scroller {
     11    overflow: auto;
     12    height: 500px;
     13    scroll-padding-top: 200px;
     14  }
     15  #changer {
     16    height: 100px;
     17  }
     18  #content {
     19    height: 1000px;
     20  }
     21 </style>
     22 <div id="scroller">
     23  <div id="changer"></div>
     24  <div id="content"></div>
     25 </div>
     26 <script>
     27  test(() => {
     28    scroller.scrollTop = 50;
     29    changer.style.height = "200px";
     30    assert_equals(scroller.scrollTop, 150, "Shouldn't anchor to #changer, since it's covered by scroll-padding");
     31  });
     32 </script>