GBH007

Simple shadow handle with progress bar

Dec 6th, 2021
1,097
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
  1. <html>
  2.   <head>
  3.     <title>TEST</title>
  4.   </head>
  5.   <body>
  6.     <progress value="0" max="100" id="pb"></progress>
  7.     <div id="main"></div>
  8.     <div id="shadow" style="display: none"></div>
  9.     <script>
  10.       function sleep(ms) {
  11.         return new Promise((resolve) => setTimeout(resolve, ms));
  12.       }
  13.       let main = document.getElementById("main");
  14.       let shadow = document.getElementById("shadow");
  15.       let pb = document.getElementById("pb");
  16.       async function handle() {
  17.         shadow.innerHTML = "";
  18.         for (let i = 1; i < 11; i++) {
  19.          pb.setAttribute("value", i * 10);
  20.          shadow.appendChild(newElement());
  21.          await sleep(1000);
  22.        }
  23.        main.innerHTML = shadow.innerHTML;
  24.        setTimeout(handle, 5000);
  25.      }
  26.      function newElement() {
  27.        let el = document.createElement("div");
  28.        el.innerText = "" + Math.random();
  29.        return el;
  30.      }
  31.      handle();
  32.    </script>
  33.   </body>
  34. </html>
  35.  
RAW Paste Data