Foros del Web - Ver Mensaje Individual

emprear · #4 (**permalink**) 20/08/2007, 17:15

Hay decenas de scripts para esto que pides, y unas cuantas variantes según el formato de fecha y hora que requieras, te doy algunos. Todos compatibles con IE7, Firefox2, Opera9. Entodos los casos utilizan la hora del cliente, demás está decir que cualquier error en la hora del mismo, se verá reflejado en la página.

Código HTML:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Fecha y Hora con Javascript</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<meta http-equiv="Content-Style-Type" content="text/css" />
<meta http-equiv="Content-Script-Type" content="text/javascript" />
<meta name="copyright" content="&copy; 2006, Guillermo Gianello" />
<style type="text/css">
span.fecha {
font-weight: bold;
font-size: 12pt;
font-family: arial,verdana,serif;
}
span.hora {
color: #FFFFFF;
background-color: #515151;
border: inset #FFFFFF 2px;
font-size: 12px;
font-family: arial,verdana,serif;
display: block;
line-height: 22px;
width: 40px;
text-align: center;
height: 22px;
vertical-align: middle;
}
</style>
</head>
<body onload="mostrar_reloj();">
<p>
En cualquiera de los ejemplos se puede dar formato aplicando CSS.
</p>
<!-- Copiar dentro del tag BODY o llamar desde un js externo -->
<script type="text/javaScript">
<!--
var mifecha=new Date()
var year=mifecha.getYear()
if (year < 1000)
year+=1900
var dia=mifecha.getDay()
var mes=mifecha.getMonth()
var diames=mifecha.getDate()
if (diames<10)
diames="0"+diames
var arraydia=new Array("Domingo","Lunes","Martes","Miercoles","Jueves","Viernes","Sabado")
var mesarray=new Array("Enero","Febrero","Marzo","Abril","Mayo","Junio","Julio","Agosto","Septiembre","Octubre","Noviembre","Diciembre")
document.write("<span class='fecha'>"+arraydia[dia]+" "+diames+" de "+mesarray[mes]+" de "+year+"</span>")
//-->
</script>

<hr />
<!-- Copiar dentro del tag BODY o llamar desde un js externo -->
<script type="text/javascript">
<!--
	var mifecha=new Date();
	var year=mifecha.getYear();
	if (year < 1000)
		year+=1900;
	var dia=mifecha.getDay();
	var mes=mifecha.getMonth()+1;
	if (mes<10)
		mes="0"+mes;
	var diames=mifecha.getDate();
	if (diames<10)
		diames="0"+diames;
	document.write("<span class='fecha'>"+diames+"/"+mes+"/"+year+"</span>")
//-->
</script>
<hr />

<p>El reloj dinámico requiere que la función mostrar_reloj(); se cargue a través del evento onload en el BODY</p>
<span class="hora">
<!-- Copiar dentro del tag BODY o llamar desde un js externo -->
<script type="text/javascript">
<!--
var viejo = "";
if (document.all||document.getElementById){
document.write('<span id="Reloj_actualIE"></span>');
}else if (document.layers){
document.write('<ilayer id="Coord_NS"><layer id="Reloj_actualNS"></layer></ilayer>');
}else {
viejo = "true";
mostrar_reloj();
}

function mostrar_reloj(){
// Fix para NS4
if (document.layers)
document.Coord_NS.visibility="show"
if (viejo == "die"){
return;
}
var RelojDigital = new Date();
var horas = RelojDigital.getHours();
var minutos = RelojDigital.getMinutes();
var segundos = RelojDigital.getSeconds();

if (horas <= 9) { horas = "0"+horas; }
if (minutos <= 9) { minutos = "0"+minutos; }
if (segundos <= 9) { segundos = "0"+segundos; }

var texto_reloj = '';
//texto_reloj += horas+':'+minutos+':'+segundos;
texto_reloj += horas+':'+minutos;

if (viejo == "true"){
document.write(texto_reloj);
viejo = "die";
return;
}

if (document.layers){
posicion_reloj = document.Coord_NS;
reloj_dinamico = posicion_reloj.document.Reloj_actualNS;
reloj_dinamico.document.write(texto_reloj);
reloj_dinamico.document.close();
}else if(document.all){
Reloj_actualIE.innerHTML = texto_reloj;
} else if(document.getElementById){
document.getElementById("Reloj_actualIE").innerHTML = texto_reloj;
}
setTimeout("mostrar_reloj()",1000);
}

//-->
</script>
</span>
<p>
Todas las scripts son compatilbles con Firefox 2.0 - Opera 9.x - IExplorer 6.x ó +.<br />
Un útimo detalle, si quieres hacer tu documento XHTML compatible, deberás incorporar las scripts desde archivos externos
<br />
Ej</p>
<p>&lt;span class=&quot;fecha&quot;&gt; <br />
&lt;script type=&quot;text/javascript&quot; src=&quot;fechayhora.js&quot;&gt;&lt;/script&gt;<br />
&lt;/span&gt;
</p>
</body>
</html>

Saludos