tor-browser

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

background-position-after-finish.html (846B)


      1 <!DOCTYPE html>
      2 <html class="reftest-wait">
      3 <title>background-position-x animation after finish</title>
      4 <style>
      5 @keyframes holdBackgroundPosition {
      6  from,to { background-position-x: 100%; }
      7 }
      8 #test {
      9  height: 100px;
     10  width: 100px;
     11  background-repeat: no-repeat;
     12  background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABkAAAAZCAMAAADzN3VRAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAAZQTFRF/wAAAAAAQaMSAwAAABJJREFUeNpiYBgFo2AwAIAAAwACigABtnCV2AAAAABJRU5ErkJggg==); /* a 25x25 px red box */
     13  animation: holdBackgroundPosition 0.01s;
     14  background-position-x: 50%;
     15 }
     16 </style>
     17 <div id="test" class="reftest-opaque-layer"></div>
     18 <script>
     19 document.getElementById("test").addEventListener("animationend", () => {
     20  requestAnimationFrame(() => {
     21    document.documentElement.classList.remove("reftest-wait");
     22  })
     23 });
     24 </script>