JavaScript - Cuenta regresiva o cuenta Atrás

Ver el tema anterior Ver el tema siguiente Ir abajo

Script JavaScript - Cuenta regresiva o cuenta Atrás

Mensaje por abel el Mar 07 Dic 2010, 09:08

Cuenta regresiva o cuenta Atrás

Este script nos permitirá colocar un mensaje que cuenta los días que faltan para una fecha indicada.
Podemos colocarlo en el mensaje del índice:
Panel de Administración > Visualización > Índice > General > Contenido del mensaje

Código:
<script>
function calcula()
{
hoy = new Date()
hasta = new Date("January 14, 2009 00:00")
dd = (hasta - hoy) / 86400000
document.getElementById('hora').innerHTML = "Faltan " + Math.ceil(dd) + " días para el evento"
if (Math.ceil(dd) == 0)
{
document.getElementById('hora').innerHTML = "Día D."
cleartimeout(tictac)
}
else tictac = setTimeout("calcula()",1000)
}
</script>
<div id="hora"><script>calcula()</script></div>

El año debe estar escrito en inglés, les dejo la lista de los meses por si no saben:
January = Enero
February = Febrero
March = Marzo
April = Abril
May = Mayo
June = Junio
July = Julio
August = Agosto
September = Septiembre
October = Octubre
November = Noviembre
December = Diciembre

También podemos colocarlo en un módulo personalizado
Pero para ello hay que seguir pasos distintos.
Vamos a Panel de administración > Módulos > Gestión de páginas HTML
Le damos a "Crear página HTML" y rellenamos el formulario de este modo:

Código:
Título *: CuentaRegresiva
¿Deseas utilizar la parte alta y la parte baja de la página de tu foro? NO
¿Utilizar esta página como índice? NO
Código HTML * : Aquí pegamos el código así (ten en cuenta que debes modificar lo que se comentó antes):

Código:
<html><head></head><body>
<script>
function calcula()
{
hoy = new Date()
hasta = new Date("July 14, 2009 00:00")
dd = (hasta - hoy) / 86400000
document.getElementById('hora').innerHTML = "Faltan " + Math.ceil(dd) + " días para el evento"
if (Math.ceil(dd) == 0)
{
document.getElementById('hora').innerHTML = "Día D."
cleartimeout(tictac)
}
else tictac = setTimeout("calcula()",1000)
}
</script>
<div id="hora"><script>calcula()</script></div>
</body></html>

Le damos a "Aceptar", volvemos a la gestión de páginas HTML y veremos que en la lista se encuentra la nueva página, copiamos la dirección de la página que hemos creado.
Ahora lo colocaremos en nuestro módulo personalizado:
En un módulo personalizado para nuestro foro
Panel de administración > Módulos > Gestión de los widgets del foro
En un módulo personalizado para nuestro portal
Panel de administración > Módulos > Gestión del portal > Estructura
Le damos a "Crear un módulo personalizado" y rellenamos las opciones de este modo:
Las tres primeras opciones las puedes rellenar como quieras, pero yo lo haré así.

Código:
Nombre del módulo: CuentaRegresiva
Usar una tabla tipo: No
Título del módulo: Aquí no pongo nada
Fuente del módulo*: Aquí colocamos el siguiente código
<iframe src="URL" width="300" height="300" frameborder="0" scrolling="no"></iframe>

Registramos y...Listo! Type
avatar
abel
Webmaster
Webmaster

Masculino Sagitario Perro
Mensajes : 94
Reputación : 3210
Agradecido : 11
Inscripción : 20/11/2010
Edad : 22
Localización : Toledo
Pais : España

http://www.noloencuentro.com

Volver arriba Ir abajo

Ver el tema anterior Ver el tema siguiente Volver arriba


 
Permisos de este foro:
No puedes responder a temas en este foro.