tor-browser

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

in-visibility-hidden-animation-pseudo-element.html (751B)

      1 <!DOCTYPE HTML>
      2 <html class="reftest-wait">
      3 <title>In visibility hidden color animation on pseudo element</title>
      4 <style>
      5 
      6 @keyframes color {
      7  0% { color: black }
      8  1% { color: blue }
      9  100% { color: blue }
     10 }
     11 
     12 div:before {
     13  visibility: visible;
     14  content: "Color Animation";
     15  animation: color 0.1s 1 forwards;
     16 }
     17 
     18 div {
     19  color: black;
     20  visibility: hidden;
     21 }
     22 
     23 </style>
     24 <div id="target">color animation on visible pseudo element attached to invisible element</div>
     25 <script>
     26 
     27 document.getElementById("target").addEventListener("animationend", AnimationEndListener);
     28 
     29 function AnimationEndListener(event) {
     30  setTimeout(RemoveReftestWait, 0);
     31 }
     32 
     33 function RemoveReftestWait() {
     34  document.documentElement.classList.remove("reftest-wait");
     35 }
     36 
     37 </script>