Foros del Web » Creando para Internet » HTML »

Contador de tiempo que no se reinicie

Estas en el tema de Contador de tiempo que no se reinicie en el foro de HTML en Foros del Web. hola gente! nacesito un contador de minutos y segundos parecido a un contador de tablero de futbol.. he buscado en internet y los pocos que ...
  #1 (permalink)  
Antiguo 16/09/2011, 16:24
 
Fecha de Ingreso: febrero-2011
Mensajes: 8
Antigüedad: 13 años, 1 mes
Puntos: 0
Pregunta Contador de tiempo que no se reinicie

hola gente! nacesito un contador de minutos y segundos parecido a un contador de tablero de futbol.. he buscado en internet y los pocos que encontre se reinician, la idea es que siga contando por mas que se actualize la pagina. tambien encontre que hay que usar el contador del servidor o algo asi. jja yo uso como hosting 000webhost.com. si alguien sabe algo por favor respondan porque no hay mucho sobre este tema.. bueno desde ya gracias al que pueda colaborar.
  #2 (permalink)  
Antiguo 16/09/2011, 17:56
 
Fecha de Ingreso: junio-2010
Mensajes: 49
Antigüedad: 13 años, 10 meses
Puntos: 2
Respuesta: Contador de tiempo que no se reinicie

Pasa una variable fija de tiempo desde la cual quieras empezar a contar y en vez de inicializar con cada carga de página el contador de tiempo a cero, hacerlo a la diferencia entre ahora y la fecha elejida.

Si das más datos como que lenguaje de servidor usas alguno te podremos ayudar mejor.
  #3 (permalink)  
Antiguo 16/09/2011, 18:11
Avatar de emprear
Colaborador
 
Fecha de Ingreso: junio-2007
Ubicación: me mudé
Mensajes: 8.388
Antigüedad: 16 años, 9 meses
Puntos: 1567
Respuesta: Contador de tiempo que no se reinicie

Mirá este método

Código HTML:
Ver original
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
  2.    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
  3. <html xmlns="http://www.w3.org/1999/xhtml">
  4. <title>Cuenta Regresiva Múltiples Relojes</title>
  5. <meta http-equiv="content-type" content="text/html; charset=utf-8" />
  6. <meta name="description" content=
  7. "Script Javascript. Cuenta regresiva a una fecha dada y acción al cumplirse el tiempo" />
  8. <meta name="keywords" content="timer, cuenta regresiva, javascript, reloj, reloj múltiple" />
  9. <meta name="author" content="Guillermo Gianello" />
  10. <style type="text/css">
  11. /*<![CDATA[*/
  12. body{
  13. background-color: #D7D7D7;
  14. }
  15. div {
  16. font-family: arial, sans-serif;
  17. font-size: 10pt;
  18. text-shadow: #6374AB 1px 1px 2px;
  19. color: #000;
  20. }
  21. #reloj1{
  22. margin-bottom: 3px;
  23. color: #530000;
  24. }
  25. /*]]>*/
  26. </head>
  27. <!-- dónde querramos el reloj poner un div con un id por cada funcion IniciaCuenta que activemos -->
  28. <div id="reloj1">[reloj1]</div>
  29. <div id="reloj2">[reloj2]</div>
  30.  
  31. <!-- la script debe ser llamada antes del cierre del body -->
  32.  
  33. <script type="text/javascript">
  34. //<![CDATA[
  35. /* configuración */
  36. // El formato del texto que se imprime en pantalla, las variable son
  37. // %%D%% para dias
  38. // %%H%% para dias
  39. // %%M%% para dias
  40. // %%S%% para dias
  41. var FormatoSalida = "<strong>Faltan<\/strong> <b>%%D%%<\/b> Dias <b>%%H%%<\/b> Horas <b>%%M%%<\/b> minutos <b>%%S%%<\/b> segundos para accionar el evento final";  
  42. // El mensaje que se muestra al cunplir el tiempo (podría adaptarse para que sea una función)
  43. var mensaje = "El tiempo expiró";
  44. // iniciamos tantas funciones IniciaCuenta como divs con relojes tengamos
  45. // se pasan los parametros id del div fecha (mes/dia/año AM/PM y tiempo UTC opcionalmente,
  46. // recordar que la script trabaja con el reloj del cliente
  47. IniciaCuenta("reloj1","09/16/2012 8:05 PM UTC-0300");
  48. IniciaCuenta("reloj2","11/16/2011 9:00 AM UTC-0300");
  49. /* fin configuración */
  50. function IniciaCuenta(divReloj,FechaDeDestino){
  51. var destino = new Date(FechaDeDestino);
  52. var ahora = new Date();
  53. var diferencia  = new Date(destino-ahora);
  54. var gsegs  = Math.floor(diferencia.valueOf()/1000);
  55. ContarAtras(divReloj,gsegs);
  56. }
  57. function Calcular(segs, num1, num2){
  58. var s = ((Math.floor(segs/num1))%num2).toString();
  59. if (s.length < 2){
  60. s = "0" + s;
  61. }
  62. return (s);
  63. }
  64. function ContarAtras(divReloj, segs){
  65. var FormatoTiempo;
  66. FormatoTiempo = FormatoSalida.replace(/%%D%%/g, Calcular(segs,86400,100000));
  67. FormatoTiempo = FormatoTiempo.replace(/%%H%%/g,  Calcular(segs,3600,24));
  68. FormatoTiempo = FormatoTiempo.replace(/%%M%%/g,  Calcular(segs,60,60));
  69. FormatoTiempo = FormatoTiempo.replace(/%%S%%/g,  Calcular(segs,1,60));
  70. if(segs > 0){
  71. document.getElementById(divReloj).innerHTML = FormatoTiempo;
  72. setTimeout("ContarAtras('" + divReloj + "'," + (segs-1) + ");", 990);
  73. }else{
  74. // aqui se muestra el mensaje, aunque como indiqué podría ser otra función
  75. document.getElementById(divReloj).innerHTML = mensaje;
  76. }
  77. }
  78. //]]>
  79. </body>
  80. </html>

Demo
http://foros.emprear.com/jsdemo/time...regresiva.html

Saludos
__________________
La voz de las antenas va, sustituyendo a Dios.
Cuando finalice la mutación, nueva edad media habrá
S.R.

Etiquetas: contador, minutos, reiniciar, segundos
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta




La zona horaria es GMT -6. Ahora son las 12:16.