在jQuery Classy Countdown中刷新页面时重置时间

Question

我想将倒数计时器设置为2017年1月1日。但是当刷新页面时倒计时重置并再次开始计时为24天23小时50分钟.. check the image

    $(document).ready(function() {
        $('#countdown4').ClassyCountdown({
            end: $.now() + 2160000,
            labels: true,
            style: {
                element: "",
                textResponsive: .5,
                days: {
                    gauge: {
                        thickness: .03,
                        bgColor: "rgba(255,255,255,0.05)",
                        fgColor: "#1abc9c"
                    },
                    textCSS: 'font-family:\'Open Sans\'; font-size:25px; font-weight:300; color:#fff;'
                },
                hours: {
                    gauge: {
                        thickness: .03,
                        bgColor: "rgba(255,255,255,0.05)",
                        fgColor: "#2980b9"
                    },
                    textCSS: 'font-family:\'Open Sans\'; font-size:25px; font-weight:300; color:#fff;'
                },
                minutes: {
                    gauge: {
                        thickness: .03,
                        bgColor: "rgba(255,255,255,0.05)",
                        fgColor: "#8e44ad"
                    },
                    textCSS: 'font-family:\'Open Sans\'; font-size:25px; font-weight:300; color:#fff;'
                },
                seconds: {
                    gauge: {
                        thickness: .03,
                        bgColor: "rgba(255,255,255,0.05)",
                        fgColor: "#f39c12"
                    },
                    textCSS: 'font-family:\'Open Sans\'; font-size:25px; font-weight:300; color:#fff;'
                }

            },
            onEndCallback: function() {
                console.log("Time out!");
            }
        });

    });
    

检查我使用的代码

Answer 1

您可以使用JavaScript方法SetInterval()进行创建倒计时。它每秒计算一次（1000毫秒）。

此示例显示如何计算到年末的时间

    $(function(){
   setInterval(function(){
        date_future = new Date(new Date().getFullYear() +1, 0, 1);
        date_now = new Date();

        seconds = Math.floor((date_future - (date_now))/1000);
        minutes = Math.floor(seconds/60);
        hours = Math.floor(minutes/60);
        days = Math.floor(hours/24);

        hours = hours-(days*24);
        minutes = minutes-(days*24*60)-(hours*60);
        seconds = seconds-(days*24*60*60)-(hours*60*60)-(minutes*60);

        $("#timeDay").text(days);
        $("#timeHours").text(hours);
        $("#timeMinutes").text(minutes);
        $("#timeSeconds").text(seconds);
    },1000);
});