20

Cuenta atrás para un evento

Me comenta Javi en el tagboard que le gustaría poner una cuenta regresiva o cuenta atrás para un suceso, para que lo entendías mejor, es ir contando los días que faltan, por ejemplo, para nuestro cumpleaños.
Me dice también que lo ha visto en Ayuda para tu blog pero que ha tenido problemas para seguir la explicación, para ser justa, he de decir que yo he usado el mismo código que ofrecen en Ayuda para tu blog, y no he tenido ningún problema para incluirlo en mi blog de pruebas.

1- Copiamos este código y lo pegamos en un nuevo elemento Html-javascript, le ponemos el título que nos parezca adecuado:
<form name="count">
<input name="count2" size="32" type="text"/>
</form>

<script>

/*
Count down until any date script-
By JavaScript Kit (www.javascriptkit.com)
Over 200+ free scripts here!
*/

//change the text below to reflect your own,
var before="Mi Cumpleaños!"
var current="Hoy es Mi Cumpleaños!"
var montharray=new Array("Jan","Feb","Mar","Apr","May","Jun","Jul","Aug","Sep","Oct","Nov","Dec")
function countdown(yr,m,d){
theyear=yr;themonth=m;theday=d
var today=new Date()
var todayy=today.getYear()
if (todayy < 1000)
todayy+=1900
var todaym=today.getMonth()
var todayd=today.getDate()
var todayh=today.getHours()
var todaymin=today.getMinutes()
var todaysec=today.getSeconds()
var todaystring=montharray[todaym]+" "+todayd+", "+todayy+" "+todayh+":"+todaymin+":"+todaysec
futurestring=montharray[m-1]+" "+d+", "+yr
dd=Date.parse(futurestring)-Date.parse(todaystring)
dday=Math.floor(dd/(60*60*1000*24)*1)
dhour=Math.floor((dd%(60*60*1000*24))/(60*60*1000)*1)
dmin=Math.floor(((dd%(60*60*1000*24))%(60*60*1000))/(60*1000)*1)
dsec=Math.floor((((dd%(60*60*1000*24))%(60*60*1000))%(60*1000))/1000*1)
if(dday==0&&dhour==0&&dmin==0&&dsec==1){
document.forms.count.count2.value=current
return
}
else
document.forms.count.count2.value=" "+dday+ " días, "+dhour+" hrs, "+dmin+" min, y "+dsec+" seg "
setTimeout("countdown(theyear,themonth,theday)",1000)
}
//enter the count down date using the format year/month/day
countdown(2007,06,20)
</script>

En esta parte del código: var before="Mi Cumpleaños!" cambiamos el texto por el suceso que queramos mostrar, "Navidad", "Vacaciones", "Fin de curso", etc.

En esta otra parte: var current="Hoy es Mi Cumpleaños!" cambiamos el texto por el suceso: "Ya estamos en Navidad", "Llegaron las vacaciones", "Por fin finalizaron las clases", etc.

Y, por último, en esta línea del código: //enter the count down date using the format year/month/day countdown(2007,06,20), cambiamos la fecha por la del suceso, es decir, la fecha de nuestro cumpleaños, del comienzo de Navidad, del día que empezamos las vacaciones...

Voy a tener una sobrina

Entradas Relacionadas:

20 comentarios:


Yagoloro

Holap!

Primeramente, muchas gracias por ayudarnos de esta manera tan bien explicada y sencilla para los que no sabemos tanto del lenguaje HTML.

Y segundo, pedirte un pequeño favor. ¿Sabes cómo se puede cambiar esa imagen que aparece al lado del nombre en las pestañas que abre el "Mozilla Firefox"? A mí me aparece la "B" de Blogger en blanco sobre un fondo naranja, y quisiera personalizar más mi blog cambiando dicha imagen. Si sabes cómo, te agradecería que me explicases cómo.

¡Muchas gracias por todo, y enhorabuena por tu futura sobrina!

Bye bye.

Anónimo

Hola y gracias yagoloro!:$

Para resolver la cuestión que me propones mira aquí:
http://elescaparatederosa.blogspot.com/2007/04/favicon-para-el-blog.html

Neo

Increible que todos los días pongas algo. Ya estoy utilizando esta cuenta atrás en Mi Blog.

¿Por cierto como hago para poner una imagen en vez de un título?

Gracias por todo

Neo

Ya lo tengo, he estado tenstando el script y era más fácil de lo que yo creía.
Ya tengo puesto una imagen encima del reloj de cuenta atrás.

Anónimo

Ya la vi neo, el dvd de pullfiction o como se diga XD, muy xula!!:D

Carlos Barrios

Hola preciosa....

Ya tengo cuenta atrás en mi blog!

Para cuándo cómo poner mascotitas que van detrás de pelotitas por las esquinitas de tu blog?

jajaja

besos y más besos, Rosa

Anónimo

Charly hola truan, jajajja, antes tenía una mosca en la esquina del blog jaaja!!:D

admin

Hola Rosa:
Hay posibilidades de ampliar el resultado de este script, con la ultima hora de celebrar el evento, no solamente el dia.

Muchas gracias por tus molestias.

Todavia no tengo colgado el contador regresivo.
http://Leydepend.blogspot.com
leydepend@gmail.com

Anónimo

admin , pues no, y de hecho he visto varios de este tipo y ninguno lo hace, ni siquiera algunos que podemos obtener online en alguna web.

Anónimo

Hola Rosa,
¿como podría hacerse esto en un párrafo de texto en lugar de en una caja input?

Muchas gracias, como siempre.

Anica1410

Una vez más, gracias por la ayuda, eres un solete y pareces el oráculo de los blogger, jejeje.. en serio, muchas gracias por este fantástico blog. Yo soy la que te dío el "Premio Dardo", te lo mereces.. Un beso guapa de:
http://entrefantasmasybuffyverso.blogspot.com/

Anónimo

anica1410 Gracias a ti!

Jose Luis

Llevo dos dias buscando y nada, y al final tu me diste la solución, por fin tengo mi cuenta atras en el blog.
por cierto si le quiero dar un poco de color donde coloco las ordenes precisas
gracias y un saludo desde Peña Athletic Club de Bilbao Monzon y redolada

... SuN ...

NO ME SALEEEE !!!!
QUE ES LO QUE ESTOY HACIENDO MAL?? :((
LO HICE TODO TAL CUAL Y NO ME QUEDAAA!!!
http://enmimundodelreves.blogspot.com/
MIRA COMO QUEDAA :((

Anónimo

... SuN ... Las mayúsculas son símbolo de gritos, procura evitarlas por favor en mi blog.
He visto ya has añadido un gadget muy mono, así que solucionado.
Y para la próxima vez, no me dejes comentario... no voy a responder a alguien que tiene un blog de esa temática.

Una Cita tan Dulce

Hola Rosa, mira acabo de poner el gadget en mi blog, pero no me sale el mensaje, si te es posible podrías darle una checadita, muchas gracias.

www.ftdfansub.blogspot.com

Anónimo

FtD Veo la cuenta atrás sin problemas en tu sidebar...

Coleccionista de sueños imposibles

He conseguido poner la cuenta atrás (después de intentarlo mil veces con diferentes webs, blogs, etc) pero... ¿Se puede poner en color? Es que me queda un petoche blanco no muy estético. Gracias!!

http://live-for-races.blogspot.com/

Felipe Calvo Cepeda

Sencillo y funcional, además que tiene una gran ventaja, y es que está libre de publicidad y de pequeñas cosas que esconden quienes crean algúnos gadgets.

Me lo llevo! :)

Publicar un comentario

Si vas a dejar una consulta, procura tener habilitado tu perfil en Blogger o deja la url del blog a revisar (no enlace).

Los comentarios están siendo moderados.

:) :(( :( :P :D :$ ;) :I :X :O |O :S