Hacer Contador, Cuenta Regresiva en Javascript

En esta ocasión vamos a ver un pequeño tutorial donde crearemos una cuenta regresiva en Javascript que se imprime en pantalla y se va actualizando inmediatamente con el pasar de los segundos.
xxxxxxxxxxxxxxxxxxxxxxx
Este contador nos puede servir de diferentes maneras, si vamos anunciar un producto en nuestra web en determinada fecha, si queremos hacer una cuenta regresiva para una fecha específica.

Nuestro contador quedara así, es totalmente personalizable a su gusto con el color y fuente que deseen.

Ver contador.


El código para crear el contador es el siguiente:

---------------------------------------------------

<!-- AVISO CONTADOR -->
<div align="center">
<script languaje="JavaScript">
function getTime() {
now = new Date();
y2k = new Date("Dec 31 2012 23:59:59");
days = (y2k - now) / 1000 / 60 / 60 / 24;
daysRound = Math.floor(days);
hours = (y2k - now) / 1000 / 60 / 60 - (24 * daysRound);
hoursRound = Math.floor(hours);
minutes = (y2k - now) / 1000 /60 - (24 * 60 * daysRound) - (60 * hoursRound);
minutesRound = Math.floor(minutes);
seconds = (y2k - now) / 1000 - (24 * 60 * 60 * daysRound) - (60 * 60 * hoursRound) - (60 * minutesRound);
secondsRound = Math.round(seconds);
sec = (secondsRound == 1) ? " segundo" : " segundos";
min = (minutesRound == 1) ? " minuto" : " minutos, ";
hr = (hoursRound == 1) ? " hora" : " horas, ";
dy = (daysRound == 1) ? " día" : " d&iacute;as, "
document.getElementById("counter").innerHTML = "Faltan " + daysRound + dy + hoursRound + hr + minutesRound + min + secondsRound + sec + " <br />para el 2012!!!";
newtime = window.setTimeout("getTime();", 1000);
}
</script>
<body onLoad="getTime()">
</div>

<p style="color:#000000;text-align:center;" id="counter"></p>

<!-- AVISO CONTADOR -->


---------------------------------------------------

En esta área definimos el estilo (Color, Fuente, etc.).

<p style="color:#000000;text-align:center;" id="counter"></p>

En esta otra definimos hasta dónde va la cuenta regresiva, en este caso hasta las 12: 59:59pm del 31 de Diciembre del 2017, ósea hasta el principio del año 2018.

y2k = new Date("Dec 31 2012 23:59:59");

Descargar bloc de notas con código funcionando!

Bastante sencillo, cualquier duda no duden en comentarla.
como hacer un cuenta atras en Javascript / crear bonoloto en javascript / CONTADOR CUENTA ATRAS SCRIPT / cuenta regresiva de 24 horas en java / reloj de cuenta regresica en java / cuenta regresiva javascipt / cuenta regresiva html / cuenta regresiva javaScript / script html de cuenta regresiva / como hacer una cuenta atras en java script /

Más articulos

Escribir un comentario

Código de seguridad
Refescar

Facebook Mundonets Twitter Mundonets YouTube Mundonets