Modificar color de los caracteres y posición de un script

[rbczgz]

Algún alma caritativa puede decirme cómo puedo modificar el color de los caracteres de este script para mostrar la hora (va sobre fondo azul oscuro y en negro no se ve bien) y su posición (para que se vea a continuacion de la fecha y no debajo):


<script languaje="javascript>
//Insert these lines in that place of page, where there should be clocks.
//---- Choice of variables ----\\
fon_size=2
fon_famil="Arial Narrow"
fon_width=7
//---------The description---------\\
/*
fon_size (3) - Parameter "SIZE" for tag <FONT> (1...7)
fon_famil ("Arial Narrow") - Parameter "FACE" for tag <FONT> ("Arial Narrow")
fon_width (5) = Distance between symbols (0)
*/
//----------------------------------\\

//This and others free scripts you can find on a site: artdhtml.com
//The script works both with Internet Explorer and with Netscape.

var ns=document.layers?1:0
var ie4=document.all?1:0
var ns6=document.getElementById&&!document.all?1:0

function tab_wri(nam_tab)
{
if(!ns)
{
document.write ("<DIV style='position:relative; left:0; top:0; width:"+(fon_width)+"'>")
for (i=0; i<10; i++){document.write ("<DIV style='position:absolute; left:0; top:0; visibility:hidden ' ID='tab"+nam_tab+"_n"+i+"'><font face="+fon_famil+" size="+fon_size+">"+i+"</font></DIV>")}
document.write ("</DIV>")
}
else
{
document.write ("<ilayer id='ilay"+nam_tab+"'>")
for (i=0; i<10; i++){document.write("<layer visibility=hide ID='lay"+nam_tab+"_n"+i+"'><font face="+fon_famil+" size="+fon_size+" color="+fon_col+">"+i+"</font></layer>")}
document.write ("</ilayer>")
}
}
function see_num(nam_tab,num_tab)
{
if(ie4)
{
for(i=0; i<10; i++)
{
if(i==num_tab){document.all["tab"+nam_tab+"_n"+num_tab].style.visibility="visible"}
else{document.all["tab"+nam_tab+"_n"+i].style.visibility="hidden"}
}
}
if(ns)
{
for(i=0; i<10; i++)
{
if(i==num_tab){document.layers["ilay"+nam_tab].document.layers["lay"+nam_tab+"_n"+num_tab].visibility="show"}
else{document.layers["ilay"+nam_tab].document.layers["lay"+nam_tab+"_n"+i].visibility="hide"}
}
}
if(ns6)
{
for(i=0; i<10; i++)
{
if(i==num_tab){document.getElementById("tab"+nam_t ab+"_n"+num_tab).style.visibility="visible"}
else{document.getElementById("tab"+nam_tab+"_n"+i) .style.visibility="hidden"}
}
}

}
sec_old="0"
function see_tim()
{
date_=new Date()
wr_s=date_.getSeconds()+""

if(sec_old==wr_s){return}

sec_old=wr_s
wr_h=date_.getHours()+""
wr_m=date_.getMinutes()+""

if (wr_h.length==2){see_num(1,wr_h.charAt(0)); see_num(2,wr_h.charAt(1))}
else{see_num(1,0); see_num(2,wr_h.charAt(0))}

if (wr_m.length==2){see_num(3,wr_m.charAt(0)); see_num(4,wr_m.charAt(1))}
else{see_num(3,0); see_num(4,wr_m.charAt(0))}

if (wr_s.length==2){see_num(5,wr_s.charAt(0)); see_num(6,wr_s.charAt(1))}
else{see_num(5,0); see_num(6,wr_s.charAt(0))}

}

document.write ("<table border=0 cellpadding=0 cellspacing=0><tr valign=top><td>")
tab_wri(1)
document.write ("</td><td>")
tab_wri(2)
document.write ("</td><td><font face="+fon_famil+" size="+fon_size+">:</font>")
document.write ("</td><td>")
tab_wri(3)
document.write ("</td><td>")
tab_wri(4)
document.write ("</td><td><font face="+fon_famil+" size="+fon_size+">:</font>")
document.write ("</td><td>")
tab_wri(5)
document.write ("</td><td>")
tab_wri(6)
document.write ("</td></tr></table>")

see_tim()
tim_int=window.setInterval("see_tim()",200)
</script>

He probado esto pero no me funciona:

<script languaje="javascript>
//Insert these lines in that place of page, where there should be clocks.
//---- Choice of variables ----\\
fon_size=2
fon_famil="Arial Narrow"
fon_width=7
fon_col="#ffffff"
//---------The description---------\\
/*
fon_size (3) - Parameter "SIZE" for tag <FONT> (1...7)
fon_famil ("Verdana") - Parameter "FACE" for tag <FONT> ("Arial Narrow")
fon_width (5) = Distance between symbols (0)
*/
//----------------------------------\\

//This and others free scripts you can find on a site: artdhtml.com
//The script works both with Internet Explorer and with Netscape.

var ns=document.layers?1:0
var ie4=document.all?1:0
var ns6=document.getElementById&&!document.all?1:0

function tab_wri(nam_tab)
{
if(!ns)
{
document.write ("<DIV style='position:relative; left:0; top:0; width:"+(fon_width)+"'>")
for (i=0; i<10; i++){document.write ("<DIV style='position:absolute; left:0; top:0; visibility:hidden ' ID='tab"+nam_tab+"_n"+i+"'><font face="+fon_famil+" size="+fon_size+" color="+fon_col+">"+i+"</font></DIV>")}
document.write ("</DIV>")
}
else
{
document.write ("<ilayer id='ilay"+nam_tab+"'>")
for (i=0; i<10; i++){document.write("<layer visibility=hide ID='lay"+nam_tab+"_n"+i+"'><font face="+fon_famil+" size="+fon_size+" color="+fon_col+">"+i+"</font></layer>")}
document.write ("</ilayer>")
}
}
function see_num(nam_tab,num_tab)
{
if(ie4)
{
for(i=0; i<10; i++)
{
if(i==num_tab){document.all["tab"+nam_tab+"_n"+num_tab].style.visibility="visible"}
else{document.all["tab"+nam_tab+"_n"+i].style.visibility="hidden"}
}
}
if(ns)
{
for(i=0; i<10; i++)
{
if(i==num_tab){document.layers["ilay"+nam_tab].document.layers["lay"+nam_tab+"_n"+num_tab].visibility="show"}
else{document.layers["ilay"+nam_tab].document.layers["lay"+nam_tab+"_n"+i].visibility="hide"}
}
}
if(ns6)
{
for(i=0; i<10; i++)
{
if(i==num_tab){document.getElementById("tab"+nam_t ab+"_n"+num_tab).style.visibility="visible"}
else{document.getElementById("tab"+nam_tab+"_n"+i) .style.visibility="hidden"}
}
}

}
sec_old="0"
function see_tim()
{
date_=new Date()
wr_s=date_.getSeconds()+""

if(sec_old==wr_s){return}

sec_old=wr_s
wr_h=date_.getHours()+""
wr_m=date_.getMinutes()+""

if (wr_h.length==2){see_num(1,wr_h.charAt(0)); see_num(2,wr_h.charAt(1))}
else{see_num(1,0); see_num(2,wr_h.charAt(0))}

if (wr_m.length==2){see_num(3,wr_m.charAt(0)); see_num(4,wr_m.charAt(1))}
else{see_num(3,0); see_num(4,wr_m.charAt(0))}

if (wr_s.length==2){see_num(5,wr_s.charAt(0)); see_num(6,wr_s.charAt(1))}
else{see_num(5,0); see_num(6,wr_s.charAt(0))}

}

document.write ("<table border=0 cellpadding=0 cellspacing=0><tr valign=top><td>")
tab_wri(1)
document.write ("</td><td>")
tab_wri(2)
document.write ("</td><td><font face="+fon_famil+" size="+fon_size+" color="+fon_col+">:</font>")
document.write ("</td><td>")
tab_wri(3)
document.write ("</td><td>")
tab_wri(4)
document.write ("</td><td><font face="+fon_famil+" size="+fon_size+" color="+fon_col+">:</font>")
document.write ("</td><td>")
tab_wri(5)
document.write ("</td><td>")
tab_wri(6)
document.write ("</td></tr></table>")

see_tim()
tim_int=window.setInterval("see_tim()",200)
</script>


Tengo cierta urgencia y agradecería mucho cualquier sugerencia.

Salu2
Rubén

[JavierB]

Hola, rbczgz.

Pon fon_col="#ffffff" tal como has intentado. Luego cambia;

document.write ("<DIV style='position:relative; left:0; top:0; width:"+(fon_width)+"'>")

por:

document.write ("<DIV style='position:relative; left:0; top:0; width:"+(fon_width)+";color:"+fon_col+"'>")

Y tambien tendrás que cambiar:

document.write ("</td><td><font face="+fon_famil+" size="+fon_size+">:</font>")

por:

document.write ("</td><td><font color="+fon_col+" face="+fon_famil+" size="+fon_size+">:</font>")

Esto último lo tienes en 2 líneas. Solo lo he probado en Internet Explorer. Lo de que salga al lado de la fecha no lo entiendo a mi no me aparece ninguna fecha.

Espero que te sirva. Saludos,

[rbczgz]

Hola Javier

Me ha funcionado a la perfección (en IE, en N no lo puedo probar porque no lo tengo). Muchísimas gracias.

Lo que decía de la fecha (que no me expliqué bien) es que tengo este script para la fecha:

<script languaje="javascript>
// a continuacion creamos la fecha en la variable date
var date = new Date()
// Luego le sacamos los datos año, dia, mes
// y numero de dia de la variable date
var año = date.getYear()
var dia = date.getDay()
var mes = date.getMonth()
var ndia = date.getDate()
//Como los dias de la semana vienen con numeros
//reemplazamos estos por el dia correspondiente
if (dia==0) {var dia="Domingo"}
if (dia==1) {var dia="Lunes"}
if (dia==2) {var dia="Martes"}
if (dia==3) {var dia="Miercoles"}
if (dia==4) {var dia="Jueves"}
if (dia==5) {var dia="Viernes"}
if (dia==6) {var dia="Sabado"}
//Y hacemos lo mismo con los meses
if (mes==0) {var mes="Enero"}
if (mes==1) {var mes="Febrero"}
if (mes==2) {var mes="Marzo"}
if (mes==3) {var mes="Abril"}
if (mes==4) {var mes="Mayo"}
if (mes==5) {var mes="Junio"}
if (mes==6) {var mes="Julio"}
if (mes==7) {var mes="Agosto"}
if (mes==8) {var mes="Septiembre"}
if (mes==9) {var mes="Octubre"}
if (mes==10) {var mes="Noviembre"}
if (mes==11) {var mes="Diciembre"}
//juntamos todos los datos en una variable
fecha = dia + " " + ndia + " de " + mes + " del " + año
//y procedemos a escribir dicha fecha
document.write (fecha)</script>

Y lo que pretendo es que se vea en la misma línea, delante de la hora (el otro script) pero no se como hacerlo. En el html lo llamo a continuación del de la fecha (con un espacio) pero en pantalla me sale en la línea de abajo.

Tengo todos los Javascript en .js para tener la página más "limpia", pero no creo que dependa de eso.

En fin, si se te ocurre algo ...



Saludos

Rubén