📌 ¿Qué es FlipDown.js?

FlipDown.js es una librería JavaScript ligera que permite crear contadores regresivos animados con un diseño estilo “flip clock” (reloj volteable). No necesita dependencias adicionales (como jQuery), y se puede integrar fácilmente en cualquier sitio HTML.

🧩 1. Descarga e instalación

Puedes descargar la librería desde su repositorio oficial o usar tu propia copia local.
En este ejemplo, los archivos están en la carpeta assets/js y assets/css:

🧱 2. Estructura básica HTML

Crea un contenedor donde se mostrará el contador.
Por ejemplo:

Este div con el ID flipdown será donde FlipDown renderice el contador.

🎨 3. Estilos personalizados

Puedes darle estilo a tu contador con CSS.
Aquí un ejemplo adaptado para escritorio y móvil:

🧠 4. Configurar el contador en JavaScript

FlipDown trabaja con timestamps Unix (segundos desde 1970).
Solo tienes que definir una fecha futura, convertirla a segundos y pasarla al constructor:

🌙 6. Activar modo oscuro

FlipDown tiene una clase de tema oscuro (.dark-theme).
Puedes activarla con:

codigo aqui

🔁 7. Resultado final

Al cargar tu página, verás un contador animado que mostrará los días, horas, minutos y segundos restantes hasta la fecha objetivo.

Cuando llegue a cero, ejecutará el código dentro de .ifEnded(), en este caso mostrando un alert().

🧩 8. Extras y personalización

Puedes mejorar el contador:

• Cambiando la fuente o colores en flipdown.css.

• Colocando un mensaje dinámico cuando termine el conteo.

• Integrándolo con tu página de lanzamiento, promoción, o evento en vivo.

💡 Ejemplo completo

Aquí tienes el código PHP listo para usar 👇