Plantilla HTML de cuenta regresiva para Navidad

Abrir en el editor Publica tu código

Recomendado

13 June 2025

Script de inyección HTML con recuperación de CDN

10 February 2026

const daysEl = document.getElementById('days');
const hoursEl = document.getElementById('hours');
const minutesEl = document.getElementById('minutes');
const secondsEl = document.getElementById('seconds');

function updateCountdown() {
  const now = new Date();
  let currentYear = now.getFullYear();

// Set Christmas date for the current year
  let christmas = new Date(`December 25, ${currentYear} 00:00:00`);

// If today's date is past Christmas, set countdown for next year's Christmas
  if (now > christmas) {
    christmas.setFullYear(christmas.getFullYear() + 1);
  }

const diff = christmas - now;

const days = Math.floor(diff / (1000 * 60 * 60 * 24));
  const hours = Math.floor((diff % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60));
  const minutes = Math.floor((diff % (1000 * 60 * 60)) / (1000 * 60));
  const seconds = Math.floor((diff % (1000 * 60)) / 1000);

daysEl.textContent = days;
  hoursEl.textContent = hours;
  minutesEl.textContent = minutes;
  secondsEl.textContent = seconds;
}

// Initial call to display the countdown immediately
updateCountdown();

// Update the countdown every second
setInterval(updateCountdown, 1000);

Plantilla HTML de cuenta regresiva para Navidad

Recomendado

Un código de Metehan

Script de inyección HTML con recuperación de CDN

Surfistas del metro

HTML

CSS

JS

Recomendado

Un código de Metehan

Script de inyección HTML con recuperación de CDN

Surfistas del metro

HTMLCopy

CSSCopy

JSCopy

HTML

CSS

JS