Como criar: Temporizador de contagem regressiva do JavaScript
- Página anterior Ícone de animação
- Próxima página Efeito de máquina de escrever
Aprenda a usar JavaScript para criar um temporizador de contagem regressiva.
Crie um temporizador de contagem regressiva
Exemplo
<!-- Exiba o temporizador de contagem regressiva no elemento --> <p id="demo"></p> <script> // Defina a data para a contagem regressiva var countDownDate = new Date("Jan 5, 2024 15:37:25").getTime(); // Atualize o cronômetro a cada 1 segundo var x = setInterval(function() { // Obtenha a data e hora atuais var now = new Date().getTime(); // Calcule a distância entre a data atual e a data do cronômetro var distance = countDownDate - now; // Calcule o número de dias, horas, minutos e segundos var days = Math.floor(distance / (1000 * 60 * 60 * 24)); var hours = Math.floor((distance % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60)); var minutes = Math.floor((distance % (1000 * 60 * 60)) / (1000 * 60)); var seconds = Math.floor((distance % (1000 * 60)) / 1000); // Exiba os resultados no elemento com id="demo" document.getElementById("demo").innerHTML = days + "d " + hours + "h "; + minutes + "m " + seconds + "s "; // Se o cronômetro terminar, escreva alguns textos. if (distance < 0) { clearInterval(x); document.getElementById("demo").innerHTML = "EXPIRED"; } , 1000); </script>
Páginas Relacionadas
Manual de Referência:Método window.setInterval() do JavaScript
- Página anterior Ícone de animação
- Próxima página Efeito de máquina de escrever