![Juan Rodríguez [Consultor]](../rc/rc262-jrc.png)
 |
| Estás en: Juan Rodríguez [Consultor] > JavaScript > Índice de guiones > Reloj "conversacional" emergente < |
Verificado en: Opera 9.02 y 9.20Opera 6.05, 7 y 8 Firefox 1.5 y 3.0b5 Firefox 1.0.2 Mozilla 1.8 Netscape 7 Internet Explorer 6 y 7
|
¿Tienes hora? Pulsa en la pregunta anterior y este guión te la "dirá". Este guión se activa automáticamente con la descarga de la página (ver <body>) para que aparezca en la barra de estado (puede anularse). Su apariencia estética se gestiona con etiquetas de estilo css (ver <head>) y los textos a displayar se establecen en el cuerpo de la página. |
Este guión es una variante (emergente) del:
Es la rutina que teníamos instalada en las páginas de Begues y donde ahora se ha dejado la variante fija, mucho más simple. |
Ejecutar Instalación Ver código Descargar + guiones
Código en las cabeceras (head) de la página. Estilo (diseño) de reloj una vez activado.
<style type="text/css">
div.reloj {position:absolute; padding:0.5em; width:490px; height:150px; left:192px; top:200px; z-index:5; visibility:hidden; background:#000 url('6758-boton_reloj.png') no-repeat 20% 30%; border:5px #576 inset}
.lin1 {height:80px; text-align:right; vertical-align:bottom}
.txt1a, .txt1b {width:250px; font-family:Tahoma, Verdana, sans-serif; font-weight:bold}
.txt1a {font-size:110%; color:#b5bbb4}
.txt1b {color:green; font-style:italic}
.lin2 {height:50px; vertical-align:bottom }
.txt2 {font-size:10pt; font-weight:bold; color:green; background:#CC9; text-align:center}
.txt3 {padding:0.1em 0.5em}
.txt3 a {color:white}
</style>
Código en las cabeceras (head) de la página. Rutina en JavaScript.
<script type="text/javascript">
<!-- inicio
var reftxt;
var RelojVisible = false
var RelojRefresco = null
var RelojActivo = false
var Hora = " "
function IniciarReloj() {PararReloj(); MostrarHora() }
function PararReloj (){ if (RelojActivo); clearTimeout(RelojRefresco); RelojActivo=false }
function MostrarReloj(num) {if (RelojVisible) {RelojVisible = false; OcultarReloj(num);} else {RelojVisible=true; VerReloj(num); } }
function VerReloj(num) {reftxt="reloj"+num; document.getElementById(reftxt).style.visibility="visible"; }
function OcultarReloj(num) {reftxt="reloj"+num; document.getElementById(reftxt).style.visibility="hidden"; }
function MostrarHora() {
var ahora = new Date()
var hora = ahora.getHours()
var minuto = ahora.getMinutes()
var texto = "Son las ";
var Hora=" ";
if (hora < 24 ) {segmento=", de la noche"};
if (hora < 20 ) {segmento=", de la tarde"};
if (hora < 15 ) {segmento=", del mediodía"};
if (hora < 13 ) {segmento=", de la mañana"};
if (hora < 6 ) {segmento=", de la madrugada"};
if (hora == 0 ) {segmento=", de la noche"};
if ( minuto >33) { ++hora }
if ( hora > 12) {hora -= 12 }
if ( hora == 0) {hora="doce"}
if ( hora == 1) {hora="una"; texto="Es la "}
if ( hora == 2) {hora="dos"}
if ( hora == 3) {hora="tres"}
if ( hora == 4) {hora="cuatro"}
if ( hora == 5) {hora="cinco"}
if ( hora == 6) {hora="seis"}
if ( hora == 7) {hora="siete"}
if ( hora == 8) {hora="ocho"}
if ( hora == 9) {hora="nueve"}
if ( hora == 10) {hora="diez"}
if ( hora == 11) {hora="once"}
if ( hora == 12) {hora="doce"}
if (minuto == 0 ) {minuto=" en punto"}
if (minuto < 4) {minuto=" pasadas" }
if (minuto < 7) {minuto=" y cinco" }
if (minuto < 9) {minuto=" y cinco pasadas"}
if (minuto < 12) {minuto=" y diez"}
if (minuto < 14) {minuto=" y diez pasadas"}
if (minuto < 17) {minuto=" y cuarto"}
if (minuto < 19) {minuto=" y cuarto pasadas"}
if (minuto < 22) {minuto=" y veinte"}
if (minuto < 24) {minuto=" y veinte pasadas"}
if (minuto < 27) {minuto=" y veinticinco"}
if (minuto < 29) {minuto=" y veinticinco pasadas"}
if (minuto == 30) {minuto=" y media en punto"}
if (minuto < 32) {minuto=" y media"}
if (minuto < 34) {minuto=" y media pasadas"}
if (minuto < 37) {minuto=" menos veinticinco"}
if (minuto < 39) {minuto=" menos veinticinco pasadas"}
if (minuto < 42) {minuto=" menos veinte"}
if (minuto < 44) {minuto=" menos veinte pasadas"}
if (minuto == 45) {minuto=" menos cuarto en punto"}
if (minuto < 47) {minuto=" menos cuarto"}
if (minuto < 49) {minuto=" menos cuarto pasadas"}
if (minuto < 52) {minuto=" menos diez"}
if (minuto < 54) {minuto=" menos diez pasadas"}
if (minuto < 57) {minuto=" menos cinco"}
if (minuto > 56) {minuto=" menos unos minutos"};
Hora = texto + hora + minuto + segmento;
document.getElementById("reloj").digitos.value=Hora;
// Puede desactivarse el reloj de la barra de estado, anulando la siguiente línea
window.status = Hora;
RelojRefresco = setTimeout("MostrarHora()",1000); }
// final -->
</script>
Código en el cuerpo (body) de la página
<body onload="IniciarReloj()">
<a href="javascript:void(0)" onclick="MostrarReloj(6)" title="¿Tienes hora?">¿Tienes hora?</a>
<div id="reloj6" class="reloj">
<table>
<tr><td class="lin1">
<span class="txt1a">Juan Rodríguez [Consultor]</span>
<br>
<span class="txt1b">Begues (Barcelona)</span>
</td></tr>
<tr><td class="lin2">
<form id="reloj" action="">
<div><input class="txt2" type="text" size="65" name="digitos" value=""></div>
</form>
</td></tr>
<tr><td>
<span class="txt3">
<a href="javascript:void(0)" onclick="MostrarReloj(6)" title="Cerrar este reloj">Cerrar</a>
</span>
</td></tr>
</table>
</div>
![Juan Rodríguez [Consultor]](../corporate/jrc010-jrc_mv.png)
Copyright ©
Juan Rodríguez y
Begues Internet s.l.
Todos los derechos reservados
Aviso Legal
![Juan Rodríguez [Consultor]](../rc/rc220-jrc_v.png)
Cuidar de nuestro entorno natural,
puede y debe ser cosa de todos.
Por ejemplo, no gastando papel para
imprimir una información que siempre
puedes tener en la pantalla de tu pc.
- -
Juan Rodríguez [Consultor]
Barcelona, Begues, Castelldefels
| Juan Rodríguez [Consultor] Begues (Barcelona) |
| Cerrar |
