Reloj de cuenta atrás.
Cuenta regresiva para fin de año:
A cualquiera le parecerá que esto de poner un contador hasta fin de año es algo snob o simplemente una tontería. Para un programador no será algo difícil y seguro que se pueden añadir muchas más funciones y ponerlo más bonito...
Pero que pensarías si el código no lo he hecho yo... bueno casi... lo ha generado ChatGPT con una línea de texto bastante poco ambiciosa. Utilidades de la IA que aún me da vueltas la cabeza haberlo hecho en unos minutos.
Gracias a todos los que se empeñan en hacer este mundillo de la tecnología más interesante.
Reloj inverso hasta fin de año...
Comentarlo en el grupo de Tecnología para Inexpertos en Facebook...
Aquí tienes un código en JavaScript para hacer un contador regresivo hasta el final de año:
// Establecer la fecha de final de año
var countDownDate = new Date("Dec 31, 2023 23:59:59").getTime();
// Variable para el índice del color actual
var colorIndex = 0;
// Actualizar el contador cada segundo
var x = setInterval(function() {
// Obtener la fecha y hora actuales
var now = new Date().getTime();
// Calcular la diferencia entre la fecha de final de año y la fecha actual
var distance = countDownDate - now;
// Calcular días, horas, minutos y segundos restantes
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);
// Construir la cadena con los números y aplicar color
var timerString = days + " días, " + hours + " horas, " + minutes + " minutos, " + seconds + " segundos";
document.getElementById("timer").innerHTML = '<span style="color:' + colors[colorIndex] + ';">' + timerString + '</span>';
// Cambiar al siguiente color cada 3 segundos
if (seconds % 3 === 0) {
colorIndex = (colorIndex + 1) % colors.length;
}
// Si la cuenta regresiva ha terminado, mostrar un mensaje
if (distance < 0) {
clearInterval(x);
document.getElementById("countdown").innerHTML = "¡Feliz Año Nuevo!";
}
}, 1000);
Este código crea una cuenta regresiva hasta el final de año, mostrando los días, horas, minutos y segundos restantes. También cambia el color del contador cada 3 segundos. Puedes personalizar los colores modificando el array colors
. Por último, si la cuenta regresiva ha terminado, mostrará el mensaje "¡Feliz Año Nuevo!".
¡Espero que te sea útil!
No se han encontrado comentarios