Advertisement
LucianoCharles2017

countDown

Jul 23rd, 2018
111
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
HTML 1.70 KB | None | 0 0
  1. <!DOCTYPE HTML>
  2. <html>
  3.     <head>
  4.         <meta name="viewport" content="width=device-width, initial-scale=1">
  5.         <style>
  6.             p {
  7.                 text-align: center;
  8.                 font-size: 60px;
  9.                 margin-top:0px;
  10.             }
  11.         </style>
  12.     </head>
  13.     <body>
  14.  
  15.         <p id="demo"></p>
  16.  
  17.         <script>
  18. //        Defina a data em que estamos contando
  19.             var countDownDate = new Date("Jul 24, 2018 21:07:25").getTime();
  20.  
  21.             // Atualiza a contagem a cada 1 segundo
  22.             var x = setInterval(function() {
  23.  
  24.                 // Obtem a data e a hora de hoje
  25.                 var now = new Date().getTime();
  26.  
  27.                 // Encontra a distância entre agora e a data da contagem regressiva
  28.                 var distance = countDownDate - now;
  29.  
  30.                 // Cálculos de tempo para dias, horas, minutos e segundos
  31.                 var days = Math.floor(distance / (1000 * 60 * 60 * 24));
  32.                 var hours = Math.floor((distance % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60));
  33.                 var minutes = Math.floor((distance % (1000 * 60 * 60)) / (1000 * 60));
  34.                 var seconds = Math.floor((distance % (1000 * 60)) / 1000);
  35.  
  36.                 // Emita o resultado em um elemento com id = "demo"
  37.                 document.getElementById("demo").innerHTML = days + "d " + hours + "h "
  38.                         + minutes + "m " + seconds + "s ";
  39.  
  40.                 // Se a contagem regressiva terminar, escreva algum texto
  41.                 if (distance < 0) {
  42.                    clearInterval(x);
  43.  
  44.                    //AQUI FAZ O TEU AJAX
  45.                }
  46.            }, 1000);
  47.        </script>
  48.  
  49.     </body>
  50. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement