Popup (countdown)

TerraChat · Abr 03, 2024, 06:12 PM

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Popup Window</title>
</head>
<body onload="openPopup()">

  <div id="popup" style="display: none; position: fixed; top: 50%; left: 50%; transform: translate(-50%, -50%); border: 0px solid #ccc; background-color: white; text-align: center;">
    <img src="https://salvador.cl/ls/ls/2024-04-03_19-03-24_placeholder.jpg" alt="Placeholder Image" width="500" height="500">
    <p id="countdown" style="font-size: 14px; margin-top: 0px; font-family: 'Tahoma', sans-serif;">Cerrando en 10 segundos...</p>
  </div>

  <script>
    function openPopup() {
      var popup = document.getElementById('popup');
      popup.style.display = 'block';
      var seconds = 10;
      var countdown = document.getElementById('countdown');
      countdown.textContent = 'Cerrando en ' + seconds + ' segundos...';

      var countdownInterval = setInterval(function() {
        seconds--;
        countdown.textContent = 'Cerrando en ' + seconds + ' segundos...';
        if (seconds <= 0) {
          clearInterval(countdownInterval);
          popup.style.display = 'none';
        }
      }, 1000);
    }
  </script>
</body>
</html>

Updates:

Popup (countdown)

TerraChat