Reloj digital con Javascript
Escrito por J.F. el Saturday, 7 de July del 2007 a las 16:29
EL script de hoy trata sobre como implementar un reloj digital mediante el uso de Javascript. El código es el siguiente:
Entre las etiquetas head como siempre colocaremos el siguiente código:
-
<head>
-
-
-
<script language="javascript">
-
<!-- Se abre el comentario para ocultar el script de navegadores antiguos
-
-
function muestraReloj()
-
{
-
// Compruebo si se puede ejecutar el script en el navegador del usuario
-
if (!document.layers && !document.all && !document.getElementById) return;
-
// Obtengo la hora actual y la divido en sus partes
-
var fechacompleta = new Date();
-
var horas = fechacompleta.getHours();
-
var minutos = fechacompleta.getMinutes();
-
var segundos = fechacompleta.getSeconds();
-
var mt = "AM";
-
// Pongo el formato 12 horas
-
if (horas> 12) {
-
mt = "PM";
-
horas = horas - 12;
-
}
-
if (horas == 0) horas = 12;
-
// Pongo minutos y segundos con dos dÃgitos
-
if (minutos <= 9) minutos = "0" + minutos;
-
if (segundos <= 9) segundos = "0" + segundos;
-
// En la variable 'cadenareloj' puedes cambiar los colores y el tipo de fuente
-
cadenareloj = "<font size='1' face='verdana'><b>" + horas + ":" + minutos + ":" + segundos + " " + mt + "</b></font>";
-
// Escribo el reloj de una manera u otra, según el navegador del usuario
-
if (document.layers) {
-
document.layers.spanreloj.document.write(cadenareloj);
-
document.layers.spanreloj.document.close();
-
}
-
else if (document.all) spanreloj.innerHTML = cadenareloj;
-
else if (document.getElementById) document.getElementById("spanreloj").innerHTML = cadenareloj;
-
// Ejecuto la función con un intervalo de un segundo
-
setTimeout("muestraReloj()", 1000);
-
}
-
-
// Fin del script -->
-
</script>
-
</head>
A continuación declararÃamos el body, haciendo la llamada a la función de mostrar la hora, de la siguiente manera:
-
<body onLoad="muestraReloj()">
Finalmente, para mostrar el reloj, colocaremos donde queramos mostrar el reloj el siguiente código:
-
<span id="spanreloj" style="position:absolute;left:10;top:10;"></span>
VÃa | Datacraft | Ver ejemplo del funcionamiento del reloj digital
Comentarios (4)
Categoria: Javascript
- Añadir este post a
- Del.icio.us -
- Meneame -
- Digg -
- Webeame
Entradas relacionadas
Comentario de agugnjgfmpojpofd
Realizado el Tuesday, 23 de December del 2008 a las 21:34
Comentario de Regulo
Realizado el Thursday, 1 de September del 2011 a las 19:45
Gracias por este script me sirvio a la perfección. XD Saludos.!
Comentario de Z.
Realizado el Thursday, 17 de November del 2011 a las 22:55
Este código si sirve!
De echo esta muy sencillo y practico para usar.
Mala suerte que el usuario “agugnjgfmpojpofd” no lo a podido
ni entender ni usar JHAjhAJAH.
SALUDOS!
Comentario de alfonso
Realizado el Friday, 30 de December del 2011 a las 5:57
muchas gracias por el codigo.
saludos…
