Skip to main content

Template: Countdown&up

累计天数

精确到秒

<body>
  <div align=center>Up Counting Sample (to seconds)</div>
  <div align=center id="up-1"></div>
  <script>
    function updateCountupS(id) {
      var birthDay = new Date("2001-01-01 00:00:00");
      var today = new Date();
      var timeDiff = today.getTime() - birthDay.getTime();

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

      var countupDisplayS = document.getElementById(id);
      countupDisplayS.innerHTML = days + " Days " + hours + " Hrs " + minutes + " Mins " + seconds + " Secs";
    }

    updateCountupS('up-1'); // 初始页面加载时显示倒计时
    setInterval(function() { updateCountupS('up-1'); }, 1000); // 每秒更新一次倒计时
  </script>
</body>

精确到分钟

<body>
  <div align=center>Up Counting Sample (to minutes)</div>
  <div align=center id="up-2"></div>
  <script>
    function updateCountupM(id) {
      var birthDay = new Date("2001-01-01 00:00:00");
      var today = new Date();
      var timeDiff = today.getTime() - birthDay.getTime();

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

      var countupDisplayM = document.getElementById(id);
      countupDisplayM.innerHTML = days + " Days " + hours + " Hrs " + minutes + " Mins ";
    }

    updateCountupM('up-2'); // 初始页面加载时显示倒计时
    setInterval(function() { updateCountupM('up-2'); }, 1000); // 每秒更新一次倒计时
  </script>
</body>

 

精确到小时

<body>
  <div align=center>Up Counting Sample (to minutes)</div>
  <div align=center id="up-3"></div>
  <script>
    function updateCountupH(id) {
      var birthDay = new Date("2001-01-01 00:00:00");
      var today = new Date();
      var timeDiff = today.getTime() - birthDay.getTime();

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

      var countupDisplayH = document.getElementById(id);
      countupDisplayH.innerHTML = days + " Days " + hours + " Hrs " + minutes + " Mins ";
    }

    updateCountupH('up-3'); // 初始页面加载时显示倒计时
    setInterval(function() { updateCountupH('up-3'); }, 1000); // 每秒更新一次倒计时
  </script>
</body>

 

倒计时

精确到秒

<body>
  <div align=center>#placeholder</div>
  <div align=center id="down-1"></div>
  <script>
    function updateCountdownS(id) {
      var birthDay = new Date("2099-12-31 00:00:00");
      var today = new Date();
      var timeDiff = birthDay.getTime() - today.getTime();

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

      var countdownDisplayS = document.getElementById(id);
      countdownDisplayS.innerHTML = days + " Days " + hours + " Hrs " + minutes + " Mins " + seconds + " Secs";
    }

    updateCountdownS('down-1'); // 初始页面加载时显示倒计时
    setInterval(function() { updateCountdownS('down-1'); }, 1000); // 每秒更新一次倒计时
  </script>
</body>

精确到分钟

<body>
  <div align=center>#placeholder</div>
  <div align=center id="down-2"></div>
  <script>
    function updateCountdownM(id) {
      var birthDay = new Date("2099-12-31 00:00:00");
      var today = new Date();
      var timeDiff = birthDay.getTime() - today.getTime();

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

      var countdownDisplayM = document.getElementById(id);
      countdownDisplayM.innerHTML = days + " Days " + hours + " Hrs " + minutes + " Mins " + seconds + " Secs";
    }

    updateCountdownM('down-2'); // 初始页面加载时显示倒计时
    setInterval(function() { updateCountdownM('down-2'); }, 1000); // 每秒更新一次倒计时
  </script>
</body>

精确到小时

<body>
  <div align=center>#placeholder</div>
  <div align=center id="down-3"></div>
  <script>
    function updateCountdownH(id) {
      var birthDay = new Date("2099-12-31 00:00:00");
      var today = new Date();
      var timeDiff = birthDay.getTime() - today.getTime();

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

      var countdownDisplayH = document.getElementById(id);
      countdownDisplayH.innerHTML = days + " Days " + hours + " Hrs " + minutes + " Mins " + seconds + " Secs";
    }

    updateCountdownH('down-3'); // 初始页面加载时显示倒计时
    setInterval(function() { updateCountdownH('down-3'); }, 1000); // 每秒更新一次倒计时
  </script>
</body>

 

Back to top