Comunidad de diseño web y desarrollo en internet online

Cómo Hacer una cuenta regresiva?

Citar            
MensajeEscrito el 03 May 2007 04:12 am
Hola a todos. Les pido su ayuda para hacer una cuenta regresiva en Flash para un sitio web. Es para que aparezca por ejemplo FALTAN 59 DIAS PARA LA FIESTA.
y que conforme pasen los dias el numero vaya disminuyendo.
Ojala alguien pueda ayudarme con el actionscrip para hacer esto, no soy muy buena para la programacion :oops:
GRACIAS !!!

Por maktub298

12 de clabLevel



 

msie7
Citar            
MensajeEscrito el 03 May 2007 06:22 am
Aquí un ejemplo de una cuenta regresiva:
Crea un MC en la capa 1 frame coloca un campo de texto dinámico y le pones como nombre de instancia: tiempo y le aumentas un fotograma simple a ésta capa.
En la capa 2 frame 1 éste código:

Código :

eventDate = new Date(2008, 2, 16);
eventMillisecs = eventDate.getTime();
currentDate = new Date();
currentMillisecs = currentDate.getTime();
msecs = eventMillisecs-currentMillisecs;
if (msecs<0) {
msecs = 0;
}
secs = Math.floor(msecs/1000);
mins = Math.floor(secs/60);
hours = Math.floor(mins/60);
days = Math.floor(hours/24);
msecs = String(Math.floor(msecs%1000/10));
secs = String(secs%60);
mins = String(mins%60);
hours = String(hours%24);
days = String(days);
if (msecs.length<2) {
msecs = "0"+msecs;
}
if (secs.length<2) {
secs = "0"+secs;
}
if (mins.length<2) {
mins = "0"+mins;
}
if (hours.length<2) {
hours = "0"+hours;
}
while (days.length<3) {
days = "0"+days;
}
tiempo.text = days+":"+hours+":"+mins+":"+secs+":"+msecs;
updateAfterEvent();

En el frame 2:

Código :

gotoAndPlay(1);


En ésta línea del código: eventDate = new Date(2008, 2, 16); puse la fecha del 16 de Marzo 2008 (mi cumpleeee), el número 2 es el número del mes 3(marzo) porque Enero se cuenta como 0... y asi sucesivamente con el resto de los meses.. hay que poner un mes menos.
Este ejemplo lo adecuas a tus necesidades.
en la orden tiempo.text..... en cada uno de las comillas pon el texto que quieras... que aparezca tras el numero
Si tan solo quieres que se muestre los dias, llama solo a la variable dias así:
tiempo.text = days+": diaaaasss para mi fiestaaaaa";

Por SadlyMistaken

104 de clabLevel



 

msie
Citar            
MensajeEscrito el 04 May 2007 05:05 pm
MIL GRACIAS SadlyMistaken POR ESE CODIGO, LO VOY A PROBAR A VER SI ME FUNCIONA.
GRACIAS!!!

Por maktub298

12 de clabLevel



 

msie
Citar            
MensajeEscrito el 04 May 2007 06:57 pm
Hola de nuevo
Ya intenté programar la cuenta regresiva y no me funcionó. Al abrir la pelicula me aparece esto:
NaN:NaN:NaN:NaN:NaN
Que puedo hacer??
puse el codigo exactamente como aparece y no me funciona.
Ojala me puedas ayudar a corregir esto.
Gracias

Por maktub298

12 de clabLevel



 

msie
Citar            
MensajeEscrito el 04 May 2007 07:53 pm
Hola maktub298, espero que lo siguiente te pueda servir de mucha ayuda...

No estoy seguro si necesitas que sea 100% en flash porque el código que te voy a colocar es en Javascript pero definitivamente funciona, puedes verlo aquí: www.icecubeideas.tk, pues bien, allí te va:

Punto Número 1:

En la etiqueta <body> debes colocar este código: onLoad="getTime()"
de modo que quedará así:

<body onLoand="getTimer()">

Punto número 2:
Asumo que trabajarás con tablas así que lo primero es que (viendo el código) coloques esté código dentro de una celda de la tabla quedando de la siguiente manera (aquí he incluído el "td" de la celda pero puedes cambiarlo si lo requieres)

Código :

 <td width="35%" height="35"><script language="JavaScript" type="text/JavaScript">
<!-- 
function getTime() {
now = new Date();
y2k = new Date("Apr 25 2007 12:00:00");
days = (y2k - now) / 1000 / 60 / 60 / 24;
daysRound = Math.floor(days);
hours = (y2k - now) / 1000 / 60 / 60 - (24 * daysRound);
hoursRound = Math.floor(hours);
minutes = (y2k - now) / 1000 /60 - (24 * 60 * daysRound) - (60 * hoursRound);
minutesRound = Math.floor(minutes);
seconds = (y2k - now) / 1000 - (24 * 60 * 60 * daysRound) - (60 * 60 * hoursRound) - (60 * minutesRound);
secondsRound = Math.round(seconds);
sec = (secondsRound == 1) ? " s" : " s";
min = (minutesRound == 1) ? " Min, " : " Mins, ";
hr = (hoursRound == 1) ? " Hr, " : " Hrs, ";
dy = (daysRound == 1)  ? " D, " : " D, "
document.timeForm.input1.value = " " + daysRound  + dy + hoursRound + hr + minutesRound + min + secondsRound + sec + "";
newtime = window.setTimeout("getTime();", 1000);
}
// -->
            </script></td>
        <td align="center"><form name="timeForm" id="timeForm">

              
              <div align="justify">
                <input type="texte" name="input1" size="25" border-style="none" style="color:#000000; background:none; border-bottom: 0px solid; border-left: 0px solid;border-right: 0px solid;border-top: 0px solid;font:24px Arial" />
              </div>
          </form></td>


Punto número 3:

Al haber colocado este código te aparecerá la cuenta regresiva y en la variable que se llama "y2k" es en donde debes colocar la fecha límite, entonce cuando lo guardas y lo abres en el explorador ya te debería funcionar. recuerda hacer el punto 1 porque si no lo colocas DEFINITIVAMENTE no te funcionará.

Que tengas mucho éxitos y cualquier duda me consultas.

Por Rudy3001

69 de clabLevel



 

Por los grandes paisajes de Guatemala

opera
Citar            
MensajeEscrito el 06 May 2007 06:38 pm
Hola Rudy3001, te agradezco mucho tu respuesta, pero apenas empiezo en esto de la programacion y la verdad no tengo nada de conocimientos acerca de java, asi que no tengo idea de como hacer el codigo que enviaste.
Si no es mucha molestia podrias por favor ayudarme a hacer el contador pero en Action Script? por favor.
Ojala puedas ayudarme.
:) Gracias de todas formas. ^^

Por maktub298

12 de clabLevel



 

msie
Citar            
MensajeEscrito el 07 May 2007 04:29 pm

maktub298 escribió:

Hola Rudy3001, te agradezco mucho tu respuesta, pero apenas empiezo en esto de la programacion y la verdad no tengo nada de conocimientos acerca de java, asi que no tengo idea de como hacer el codigo que enviaste.^^


:lol: mmm, bueno, siempre que uno anda metido en todo esto de la progra, animación y demás siempre es bueno que conozcas un poquito de lo diferentes códigos que hay.. en fin, es solamente una recomendación.

Otra cosa que te recomiendo(en buen plan) es que siempre es bueno indagar un poquito pues quizás encuentres la respuesta y tendrás mayores beneficios porque aprenderás mejor pero ya estuvo de recomendaciones, te escribo ahora el código que necesitas:

Paso 1:

Creas un campo de texto dinámico que se llame "campo" y le colocas este nombre como "nombre de instancia"

Paso 2:

En el frame en donde se encuentra este campo colocas el siguiente código:

Código :

// aqui coloca la fecha límite, en formato año, mes. dia, hora, minuto, seg
// recuerda que el mes empieza de 0...
endDate = new Date(2010,03,02,10,00,00,00)
timeLeft = (endDate - new Date());
var d = 24*60*60*1000;
var h = 60*60*1000;
var m = 60*1000;
var s = 1000;
dosDigitos = function( value ){
   return (value < 10 )?( "0" + value ):(value)
}
function calculate (factor){
   var result = Math.floor(timeLeft /factor)
   timeLeft -= (result * factor)
   return dosDigitos(result);
}
getTimeLeft = function (){
   timeLeft = (endDate - new Date());
   if( timeLeft > 0 ){
      dias = calculate(d)
      horas = calculate(h)
      minutos = calculate (m)
      segundos = dosDigitos(Math.floor(timeLeft/1000));
      campo.text = dias + " Dias : " + horas + " Horas : " +  minutos + " Min : " + segundos + " Segs"
    }else{
      //se acab&oacute;
      campo.text = "00 d&iacute;as, 00 : 00 : 00"
      clearInterval(id)
    }
}
this.createTextField("campo",1,0,0,0,0)
this.campo.autoSize= true;
id= setInterval(getTimeLeft,1000)
stop();


y Listo!!!!

En realidad puedes obviar la colocación del campo de texto dinámico pero el problema es que no podrás manipular fácilmente la posición, tamaño, fuente y color del reloj.

Espero que este código sí sea de provecho y como te sugería arriba, siempre es bueno buscar pues esta información la encontré aquí mismo en Cristalab, pero SIEMPRE que quieras puedes preguntar pues aquí en Cristalab estamos para ayudarte....

:wink: Éxitos en todo y ojalá te salga muy bien, si no es molestia me gustaría que me contaras cuando ya lo tengas listo :wink: ^^

Por Rudy3001

69 de clabLevel



 

Por los grandes paisajes de Guatemala

opera
Citar            
MensajeEscrito el 12 Jun 2009 10:34 pm
Muy bueno justo me vino perfecto para la inauguracion de una web que estoy terminando.

tengo una duda, con la hora de quien compara cuanto falta del hosting o del visitante?

Por tomassaucedo

11 de clabLevel



Genero:Masculino  

Argentina

firefox
Citar            
MensajeEscrito el 13 Jun 2009 03:04 pm
Hola, la hora la toma del servidor/hosting puesto que si la tomara del visitante podría variar si este tuviera mala la hora de su computadora, puedes comprobar que funciona de esta manera si la colocas en el servidor/hosting y luego alteras la hora de tu computador, OJO que si lo estás probando en un servidor local obviamente la hora va a cambiar porque según flash tu computadora es el server/hosting :wink:

Por Rudy3001

69 de clabLevel



 

Por los grandes paisajes de Guatemala

safari
Citar            
MensajeEscrito el 13 Jun 2009 03:39 pm
muchisimas gracias, les dejo la web en la que aplique el script.

les cuento que modifique unas lineas para que cuando la cuenta se igual a cero redireccione a la web terminada, en este caso el flash esta contenido en un index.html y la web funcional en index.php entonces solo queda que cuandose "inaugure" yo borre el index.html del ftp para que ni si quiera aparezca la cuenta en cero.

www.picnicdecor.com

Por tomassaucedo

11 de clabLevel



Genero:Masculino  

Argentina

firefox
Citar            
MensajeEscrito el 19 Nov 2009 05:09 pm
como siempre lo eh dicho seria bueno que compartieras que lineas de codigo cambiaste para que los demas tambien puedan ofrecer un buen servicio en su web

Por iimeh

1 de clabLevel



 

msie7
Citar            
MensajeEscrito el 19 Nov 2009 06:33 pm
cierto.

el codigo que utilice es este


Código ActionScript :

// aqui coloca la fecha límite, en formato año, mes. dia, hora, minuto, seg
// recuerda que el mes empieza de 0...
endDate = new Date(2009,05,24,18,00,00,00)
timeLeft = (endDate - new Date());
var d = 24*60*60*1000;
var h = 60*60*1000;
var m = 60*1000;
var s = 1000;
dosDigitos = function( value ){
   return (value < 10 )?( "0" + value ):(value)
}
function calculate (factor){
   var result = Math.floor(timeLeft /factor)
   timeLeft -= (result * factor)
   return dosDigitos(result);
}
getTimeLeft = function (){
   timeLeft = (endDate - new Date());
   if( timeLeft > 0 ){
      dias = calculate(d)
      horas = calculate(h)
      minutos = calculate (m)
      segundos = dosDigitos(Math.floor(timeLeft/1000));
      campo.text = dias + ":" + horas + ":" +  minutos + ":" + segundos;
    }else{
      //se acabo;
     getURL("http://www.picnicdecor.com/index.php");
/*    campo.text = "00 d&iacute;as, 00 : 00 : 00"*/
      clearInterval(id)
    }
}
this.createTextField("campo",1,0,0,0,0)
this.campo.autoSize= true;
id= setInterval(getTimeLeft,1000)


stop();

Por tomassaucedo

11 de clabLevel



Genero:Masculino  

Argentina

firefox
Citar            
MensajeEscrito el 18 Ene 2011 05:47 am
Muy bueno pero como se puede hacer para que valla corriendo el tiempo? por que una vez que carga la pelicula se queda congelado el valor del tiempo faltante, osea que hay que recargarla para ver el tiempo que falta en ese momento.

Por dazedweb

11 de clabLevel



 

firefox

 

Cristalab BabyBlue v4 + V4 © 2011 Cristalab
Powered by ClabEngines v4, HTML5, love and ponies.