0

我只是在寻求与 Flipclock.js 插件真正相关的一些建议。

我已经编写了以下代码,并提供了大量帮助来每天进行时钟倒计时,据我所知,这工作得很好,因为我一直在努力为每天的计时器做我想做的事情在线查找可靠的文档。

这是用于显示 1500 小时免费交付阈值的到期时间的每日计时器,但在周末情况并非如此。是否可以使用条件来检查当前日期是星期六还是星期日,如果是,则相应地增加小时数以显示总小时/分钟,直到星期一的 1500?

我最后担心的是我正在获取基于 UST 的信息。英国目前有 1 小时的偏移量,但并非总是如此。使用 if only 语句并根据夏令时日期偏移小时的唯一可行解决方案是 - 还是有更顺畅的解决方案?

谢谢你的帮助

      var clock;
  
  // Check if it is a weekend or not
      var d = new Date();
      var n = d.getDay();
      if( n == 6 )
       var deadlineHour = 15, offset = 2;
      else if( n == 0)
        var deadlineHour = 15, offset = 1;
      else
        var deadlineHour = 15, offset = 0;

    $(document).ready(function() {

        // Grab the current date
        var currentDate = new Date();

        if(currentDate.getHours() >= deadlineHour) {
            offset = 1;
        }
      
        var opts = {
        clockFace: 'HourlyCounter',
        countdown: true,
        callbacks: {
            stop: function() {
                clock.setTime(24 * 60 * 60);
                clock.start();
            }
        }
    };
    opts.classes = {
        active: 'flip-clock-active',
        before: 'flip-clock-before',
        divider: 'flip-clock-divider',
        dot: 'flip-clock-dot',
        label: 'flip-clock-label',
        flip: 'flip',
        play: 'play',
        wrapper: 'flip-clock-small-wrapper',
    };  

        var futureDate = new Date(
            currentDate.getFullYear(), 
            currentDate.getMonth(), 
            currentDate.getDate() + offset, 
            deadlineHour
        );

        // Calculate the difference in seconds between the future and current date
        var diff = futureDate.getTime() / 1000 - currentDate.getTime() / 1000;

        // Instantiate a coutdown FlipClock
        clock = $('.clock').FlipClock(diff, opts);

    });
<script type='text/javascript' src='//code.jquery.com/jquery-1.10.1.js'></script>
<script type='text/javascript' src="http://flipclockjs.com/_themes/flipclockjs/js/flipclock/flipclock.js"></script>
<link rel="stylesheet" type="text/css" href="http://flipclockjs.com/_themes/flipclockjs/css/flipclock.css">
    
<br/><div class="clock"></div>

4

0 回答 0