teroristkata

ZaGeri

Jan 21st, 2021
969
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
  1. .timer-container {
  2.   border: solid 2px green;
  3. }
  4.  
  5.  
  6.  
  7. .loader {
  8.   border: 16px solid #f3f3f3; /* Light grey */
  9.   border-left: 16px solid #c528bd; /* Blue */
  10.   border-radius: 50%;
  11.   width: 120px;
  12.   height: 120px;
  13.   animation: load 6s linear infinite;
  14.  /* margin-left: auto;*/
  15. }
  16.  
  17. @keyframes load {
  18.   0% { transform: rotate(0deg); }
  19.   100% { transform: rotate(360deg); }
  20.  
  21. }
  22.  
  23. .timer{
  24.   position: absolute;
  25.   margin-top: 12%;
  26.   font-size: 350%;
  27.   z-index: 3;
  28. }
  29.  
  30.  
  31.  
  32.  
  33.  
  34.  
  35.  
  36.  
  37.  
  38. //Function TIMER
  39. var timeleft = 60;
  40. var downloadTimer = setInterval(function(){
  41.   if(timeleft <= 0){
  42.     clearInterval(downloadTimer);
  43.     document.getElementById("timer1").innerHTML = "Finished";
  44.   } else {
  45.     document.getElementById("timer1").innerHTML = timeleft;
  46.   }
  47.   timeleft -= 1;
  48. }, 1000);
  49.  
  50.  
  51.  
  52.  
  53.  
  54.  
  55. <!-- Game One Container -->
  56.     <div class="game-container game-container-1" id="game1">
  57.     <output class="timer" id="timer1" value=""></output>
  58.  
  59.         <output id="gameLabel1" class="gameLabel" value=""></output>
  60.         <p>Some game is playing...</p>
  61.         <label>RESULT</label>
  62.         <output class="result-game" id="result-game1"></output>
  63.     <div class="timer-container">
  64.        
  65.      <div class="loader"></div>
  66.        
  67.  
  68.     </div>
  69.        
  70.  
  71.  
  72.         <button class="ok-button" id="ok-button-game1" onclick="closeGame(this)">GET RESULT</button>
  73.     </div>
  74.     <!-- End of Game One Container -->
RAW Paste Data