首页 > 解决方案 > Evergreen 倒数计时器在移动 HTML 中不起作用

问题描述

您好,我最近在我正在构建的 Webflow 站点中添加了一个倒数计时器,但由于某种原因,它在移动设备中不起作用,但在桌面设备中运行得非常好。不知道是什么原因造成的。我是编码新手,所以这可能有一个非常简单的解决方案,但我对我遇到的数据感到震惊。这是代码

<script> (function() {
 
      var deadline = new Date();
     deadline.setMinutes( deadline.getMinutes() + 90 );


function pad(num, size) {
    var s = "0" + num;
    return s.substr(s.length-size);
}

function getTimeRemaining(endtime) {
  var t = Date.parse(endtime) - Date.parse(new Date()),
      seconds = Math.floor((t / 1000) % 60),
      minutes = Math.floor((t / 1000 / 60) % 60),
      hours = Math.floor((t / (1000 * 60 * 60)) % 24),
      days = Math.floor(t / (1000 * 60 * 60 * 24));

  return {
    'total': t,
    'days': days,
    'hours': hours,
    'minutes': minutes,
    'seconds': seconds
  };
}

function clock(id, endtime) {
  var days = document.getElementById(id + '-days')
      hours = document.getElementById(id + '-hours'),
      minutes = document.getElementById(id + '-minutes'),
      seconds = document.getElementById(id + '-seconds');

  var timeinterval = setInterval(function() {
    var t = getTimeRemaining(endtime);

   if (t.total <= 0){
      clearInterval(timeinterval);

 
     deadline = new Date();
     deadline.setMinutes( deadline.getMinutes() + 1 );
       clock('js-clock', deadline); 
     
    } else {
days.innerHTML = pad(t.days, 2);
hours.innerHTML = pad(t.hours, 2);
minutes.innerHTML = pad(t.minutes, 2);
seconds.innerHTML = pad(t.seconds, 2);
}
  }, 1000);
}

clock('js-clock', deadline); })(); </script>

标签: javascripthtmlwebflow

解决方案


推荐阅读