Question

到目前为止，这是我的调用脚本，

<script type="text/javascript">
var clock = $('.clock').FlipClock(3600 * 24 * 5, {
    clockFace: 'DailyCounter',
    countdown: true,
});
</script>

请有人告诉我如何从确切的日期算起来？

例如，日期是2014年7月21日在英国时间，并且访问该网站的每个人将根据当前日期查看到该日期剩余的时间。

Answer 1

这就是我使用的

<div class="clock"></div>
<script type="text/javascript">
    var date = new Date(2015, 6, 21);
    var now = new Date();
    var diff = (date.getTime()/1000) - (now.getTime()/1000);

    var clock = $('.clock').FlipClock(diff,{
        clockFace: 'DailyCounter',
        countdown: true
    });  
</script>

月份是零基础，所以7月是第7个月，使用6。

Answer 2

@Matt，很好的例子，但我可以看到为什么＆＃34; coolshrimp＆＃34;发布了类似的公式，两者都是正确的一半。

在我的网站上，当我使用jsfiddle时，我希望它也能显示＆＃34; Hours＆＃34; ＆＃34;分钟＆＃34;以及＆＃34; Seconds＆＃34;，以下示例对我来说非常合适：

    <script type="text/javascript">
        var date = new Date("February 01, 2016 02:15:00"); //Month Days, Year HH:MM:SS
        var now = new Date();
        var diff = (date.getTime()/1000) - (now.getTime()/1000);

        var clock = $('.clock').FlipClock(diff,{
            clockFace: 'DailyCounter',
            countdown: true
        });
    </script>

Answer 3

简单：

<div class="clock"></div>

<script type="text/javascript">
    var clock = $('.clock').FlipClock(new Date("August 15, 2015 03:24:00"),{
    clockFace: 'DailyCounter',
    countdown: true
    });  
</script>

OR

<div class="clock"></div>

<script type="text/javascript">
    var clock = $('.clock').FlipClock(new Date(2015,8,15),{
    clockFace: 'DailyCounter',
   countdown: true
   });  
</script>

Answer 4

你必须这样做：

$(document).ready(function(){
    var date = new Date(2014, 7, 21, 0,0,0,0);
    var today = new Date();

    var dif = date.getTime() - today.getTime();

    var timeLeft = Math.abs(dif/1000)/60;


    var clock = $('.clock').FlipClock({
        autoStart: false,
        clockFace: 'DailyCounter',
        countdown: true
    });

    clock.setTime(timeLeft);
    clock.start();   
});

时间功能稍微偏离，所以你必须玩它才能做到正确。

小提琴：http://jsfiddle.net/Uscg9/4/

Answer 5

我认为使用Date的api函数会更好（reference）

$(document).ready(function() {
    // Today's date object.
    var today   = new Date();
    today   = today.getTime()/1000;

    // Final date object.
    var finalDate = new Date();

    // Setting year for final date.
    finalDate.setFullYear(2016);

    // Setting month for final date.
    // Month counting starts from 0 i.e. Jan = 0, therefore March = 2.
    finalDate.setMonth(2);

    // Setting Day for final date.
    finalDate.setDate(17);

    // Setting Hours for final date.
    finalDate.setHours(12);

    // Setting Minutes for final date.
    finalDate.setMinutes(00);

    // Setting Seconds for final date.
    finalDate.setSeconds(00);

    var finalDate  = finalDate.getTime()/1000;
    var diff  = finalDate - today;

    $('div#countdown-clock').FlipClock(diff, {
        clockFace: 'HourlyCounter',
        countdown: true
    }); 
});

Answer 6

您需要自己计算差异。查看倒计时到新年的示例： https://github.com/objectivehtml/FlipClock/blob/master/examples/countdown-from-new-years.html

$(document).ready(function() {
    // Grab the current date
    var currentDate = new Date();
    // Set some date in the past. In this case, it's always been since Jan 1
    var pastDate  = new Date(currentDate.getFullYear(), 0, 1);
    // Calculate the difference in seconds between the future and current date
    var diff = currentDate.getTime() / 1000 - pastDate.getTime() / 1000;
    // Instantiate a coutdown FlipClock
    clock = $('.clock').FlipClock(diff, {
        clockFace: 'DailyCounter'
    });
);

使用flipclock.js从特定日期倒计时

6 个答案: