Question

我有一个带有倒计时器的模板，它已经有我喜欢的CSS和格式，但是当前模板设置为使用未来日期的倒数计时器。我想做一个简单的转换为5分钟的倒数计时器，每次页面加载时都会以5分钟开始。

以下是该网站目前的代码/逻辑，任何帮助都非常赞赏!!

//JUST EDIT Date(2015, 0, 1, 9, 30) 2015 YEAR, 0 MONTH, 1 DATE, 30 SECOND
$('#myCounter').mbComingsoon({expiryDate: new Date(2017, 12, 1, 9, 30), speed: 100});

Answer 1

计数器采用倒计时停止时间的Date对象。因此，为了获得您想要的结果，您可以创建一个距当前时间5分钟的Date对象。

var countdownDate = new Date(); //create a Date object of current time
countdownDate.setMinutes(countdownDate.getMinutes() + 5); //Add 5 minutes to it
$('#myCounter').mbComingsoon({expiryDate: countdownDate, speed: 100}); //Initialize counter

Answer 2

您目前不需要Date个对象。它已经是当前时间了。您可以按照以下步骤进行5分钟;

＆＃13;

var insertZero = n => n < 10 ? "0"+n : ""+n,
   displayTime = n => n ? time.textContent = insertZero(~~(n/3600)%3600) + ":" +
                                             insertZero(~~(n/60)%60) + ":" +
                                             insertZero(n%60)
                        : time.textContent = "IGNITION..!",
 countDownFrom = n => (displayTime(n), setTimeout(_ => n ? sid = countDownFrom(--n)
                                                         : displayTime(n), 1000)),
           sid;
countDownFrom(300);
setTimeout(_ => clearTimeout(sid),300000);

＆＃13;

<div id="time"></div>

＆＃13;

将倒数计时器从日期更改为5分钟

2 个答案: