buenas,
estoy haciendo un script muy simple de cuenta atras para saber cuanto falta para una cosa que sucedera en ya menos de 9 meses... ¿que será, será?...
me gustaria que a través de ese script pudiera tener una representación mas visual como por ejemplo una barra de dos colores que me marcar en rojo el tiempo ya transcurrido desde la fecha inicial y el tiempo que aún queda en verde.
Alguien sabe como?
Aqui os dejo el ejemplo: (esta en catalan pero supongo que lo entendereis facilmente)
Código PHP:
<html>
<head>
<title></title>
<script type="text/javascript" language="JavaScript">
var futur = new Date (2005,11,10,00,00);
var actualiza = 1000;
function faltan(){
var ahora = new Date();
var faltan = futur - ahora;
if (faltan > 0){
var segundos = Math.round(faltan/1000);
var minutos = Math.floor(segundos/60);
var segundos_s = segundos%60;
var horas = Math.floor(minutos/60);
var minutos_s = minutos%60;
var dias = Math.floor(horas/24);
var horas_s = horas%24;
var passat = Math.ceil((280-dias)/7)
var mes = new Array("de gener", "de febrer", "de març", "d'abril", "de maig", "de juny", "de juliol", "d' agost", "de setembre", "d'octubre", "de novembre", "de desembre");
var diasemana = new Array("Diumenge", "Dilluns", "Dimarts", "Dimecres", "Dijous", "Divendres", "Dissabte");
var d = new Date();
document.formulario.alfa.value=(diasemana[d.getDay()]+" "+d.getDate().toString() + " "+mes[d.getMonth()]+" del "+d.getFullYear().toString()+" ");
document.formulario.diesqf.value= "falten " + dias + " dies";
document.formulario.sem.value= "estem a la setmana " + passat;
setTimeout("faltan()",actualiza);
}
else {
document.formulario.alfa.value= "ja toca..." ;
return true;
}
}
</script>
</head>
<body onload="faltan()">
<form name="formulario">
<input name="alfa" type="text" id="alfa" value="" size="80" border="0">
<input name="diesqf" type="text" id="diesqf" value="" size="80" border="0">
<input name="sem" type="text" id="sem" value="" size="80" border="0">
</form>
<table width="280" border="0">
<tr>
<td width="33" bgcolor="#FF0000"> </td>
<td width="233" bgcolor="#33CC00"> </td>
</tr>
</table>
<p> </p>
</body></html>