Poner varios Coutndown en la la misma pagina

aegisversus · #1 (**permalink**) 10/10/2012, 16:52

consegui este codigo uy funciona perfeto:

<center><span class="Apple-style-span" style="color: red; font-family: 'Trebuchet MS', sans-serif;">Faltan solamente</span></center><center><script language="JavaScript" type="text/javascript">
//<![CDATA[
TargetDate = "MM/DD/AA 09:10 PM";
BackColor = "white";
ForeColor = "black";
CountActive = true;
CountStepper = -1;
LeadingZero = true;
DisplayFormat = "%%D%% Días, %%H%% Horas, %%M%% Minutos, %%S%% Segundos.";
FinishMessage = "Feliz fin del mundo!!!";
//]]>
</script><script language="JavaScript" src="http://scripts.hashemian.com/js/countdown.js" type="text/javascript">
</script></center><center><span class="Apple-style-span" style="color: red; font-family: 'Trebuchet MS', sans-serif;">Para el fin del mundo</span></center>

el problema es que necesito poner unos 15 o 20 countdown en la misma pagina

como lo hago, obviando el hecho de copiar 20 veces esos mismo que es lo que no quiero hacer hay alguna forma de hacerlo

las fechas serian cargadas mediante una variable

cual seria la manera correcta de hacerlo gracias

emprear · #2 (**permalink**) 10/10/2012, 21:54

En primer lugar, bienvenido a FDW @aegisversus
Hay una variante a esa script para poner multiples countdowns

Código Javascript:

Ver original<html>
<head>
<title>Multiple Countdown Clocks</title>
</head>
<body>
    <div id="clock1">[clock1]</div>
    <div id="clock2">[clock2]</div>
</body>
<script type="text/javascript">
 
  StartCountDown("clock1","9/11/2013 12:50 AM -0300")
  StartCountDown("clock2","10/11/2012 1:00 AM -0430")
  
  /*
    Author:     Robert Hashemian (http://www.hashemian.com/)
    Modified by:    Munsifali Rashid (http://www.munit.co.uk/)
    Modified by:    Tilesh Khatri
  */
  
  function StartCountDown(myDiv,myTargetDate)
  {
    var dthen   = new Date(myTargetDate);
    var dnow    = new Date();
    ddiff       = new Date(dthen-dnow);
    gsecs       = Math.floor(ddiff.valueOf()/1000);
    CountBack(myDiv,gsecs);
  }
  
  function Calcage(secs, num1, num2)
  {
    s = ((Math.floor(secs/num1))%num2).toString();
    if (s.length < 2) 
    {   
      s = "0" + s;
    }
    return (s);
  }
  
  function CountBack(myDiv, secs)
  {
    var DisplayStr;
    var DisplayFormat = "%%D%% Days %%H%%:%%M%%:%%S%%";
    DisplayStr = DisplayFormat.replace(/%%D%%/g,    Calcage(secs,86400,100000));
    DisplayStr = DisplayStr.replace(/%%H%%/g,       Calcage(secs,3600,24));
    DisplayStr = DisplayStr.replace(/%%M%%/g,       Calcage(secs,60,60));
    DisplayStr = DisplayStr.replace(/%%S%%/g,       Calcage(secs,1,60));
    if(secs > 0)
    {   
      document.getElementById(myDiv).innerHTML = DisplayStr;
      setTimeout("CountBack('" + myDiv + "'," + (secs-1) + ");", 990);
    }
    else
    {
      document.getElementById(myDiv).innerHTML = "tiempo cumplido";
    }
  }
 
</script>
</html>

SAludos

aegisversus · #3 (**permalink**) 10/10/2012, 22:31

Muchas gracias de verdad Gracias.

tengo 2 consultas adicionales si puedes ayudarme

Como le agrego milisegundos ?
como hago para que cuando sea 1 dia diga: 1 Dia y no 1 Dias ?

Gracias

emprear · #4 (**permalink**) 10/10/2012, 22:55

milisegundos para una fecha?
eso más bien sería para un timer tipo cronómetro.
Adaptar esa script, no se tendría que ponerme a hacerlo.
Date una vuelta por acá
http://www.ricocheting.com/code/java...ountdown-timer

Y después fijate como hacerlo múltiple, ahi dice como

Saludos