如何让Flipclock自动设定特定日期的时间

问题描述 投票:0回答:1

所以我设置了Flipclock,它正在工作,但它不能按我的意愿工作

这是代码:

endtimeYear: 0,
        endtimeMonth: 0,
        endtimeDate: 0,
        endtimeHours: 0,
        endtimeMinutes: 0,
        endtimeSeconds: 0,

我正在尝试设置倒计时,但每次我输入日期,小时,分钟和秒都不会自动更新。如果我的例子编辑我的代码,它只会重置,这是不应该做的。

如果我的例子将它设置为10月1日,那么它应该自动进行。

谁知道怎么做?对不起,我很难解释这个问题。希望你理解!

javascript css flipclock
1个回答
0
投票

由于FlipClock.js将秒数作为参数,因此请将倒计时的日期在new Date('October 1 2019)上结束,并从当前日期new Date()中减去该数字。从他们的different clock faces的例子包括clockFace: 'DailyCounter'选项以及showSeconds: false使它更干净。

const seconds = (new Date('October 1 2019').getTime() - new Date().getTime()) / 1000
if (seconds > 0) {
  new FlipClock($('.your-clock'), seconds, {
    countdown: true,
    clockFace: 'DailyCounter',
    showSeconds: false
  });
} else { 
  $('.your-clock').text("It's October 1st!");
}
<br/>
<div class="your-clock"></div>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/flipclock/0.7.8/flipclock.min.css">
<script src="https://code.jquery.com/jquery-3.4.0.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/flipclock/0.7.8/flipclock.min.js"></script>
© www.soinside.com 2019 - 2024. All rights reserved.