Sección "Java Scripts"

Lección 66

Reloj digital de colores

Este es un efecto muy hermoso al cual puedes instalar fácilmente en tu sitio.

Para lograrlo pegas este Script donde dice <Body> en el HTML de tu página, es decir, quitas la etiqueta <Body>, y en su reemplazo, colocas este código:

<body onLoad="loadclock()" example: <body onLoad="loadclock()">

<script>
Free Web Hosting by Netfirms
Web Hosting by Netfirms | Free Domain Names by Netfirms


<!--

/*
Live Text Clock Script- 
© Dynamic Drive (www.dynamicdrive.com)
For full source code, installation instructions,
100's more DHTML scripts, and Terms Of
Use, visit dynamicdrive.com
*/

function show2(){
var Digital=new Date()
var hours=Digital.getHours()
var minutes=Digital.getMinutes()
var seconds=Digital.getSeconds()
var dn="AM" 
if (hours>12){
dn="PM"
hours=hours-12
}
if (hours==0)
hours=12
if (minutes<=9)
minutes="0"+minutes
if (seconds<=9)
seconds="0"+seconds
var ctime="<b><font face='Verdana' color='#8000FF'>"+hours+":"+minutes+":"+seconds+" "+dn+"</font></b>"
if (!document.all)
document.write(ctime)
else
tick2.innerHTML=ctime
}
function loadclock(){
if (document.all)
setInterval("show2()",1000)
}
if (!document.all)
show2()
//-->
</script>

Este código lo pegas en cualquier sector de tu sitio, pero siempre debajo de donde dice <Body> en el HTML de tu página:

<div align="center">

<center>

<table border="0" cellpadding="0" cellspacing="0">

<tr>

<td><span id=tick2>

</span>

</td>

</tr>

</table>

</center>

</div>

Lo que pinté con rojo corresponde al color de los dígitos del reloj, lo puedes cambiar a gusto bas{andote en la tabla de colores.

Aquí copio nuevamente el código con opción para seleccionarlo, cortar y pegar en tu sitio.

Para ello haces click en cualquier palabra que se halla dentro de la caja, Te diriges a "Edición" en el menú superior de la barra de herramientas, e indicas "Seleccinar todo", luego tomas lo seleccionado dirigiéndote nuevamente a "Edición", pero esta vez indicas "Cortar", y posteriormente te posicionas en tu página, donde quieres colocar este código, entonces te diriges a Edición, y le indicas "Pegar". 

Si deseas hacer las cosas más rápido, puedes verificar en "Edición" (está escrito al lado de las palabras que indican cada orden) que pulsando "Control" + una letra determinada, puedes "seleccionar todo", "cortar" o "pegar" en forma instantánea y con eso evitas tener que ingresar constantemente al menú de "Edición".

Esto es lo que debes pegar en reemplazo de  <Body> en el HTML de tu página:

Esto es lo que debes pegar debajo de donde dice <Body> en el HTML de tu página:

Si de todos modos, no funciona este efecto, corta el código HTML que debes colocar en tu página, pero antes de hacerlo, pégalo en tu Block de notas, y luego si córtalo de allí y pégalo en tu sitio. Ahora si no creo que haya ningún inconveniente que te impida disfrutar de este bonito efecto.

Recordemos que este Script también puede ser hallado en el programa AAScripter v2, el cual puedes bajar de aquí: http://www.cyberiapc.com

Buena suerte.