倒计时不按预期倒计时

时间:2014-04-14 17:46:12

标签: javascript jquery timer countdown countdowntimer

希望得到一些帮助,因为我不是一个js专家。

我有一个倒计时设置,改编自Keith Wood's countdown。它并没有在任何浏览器中倒计时,尽管它似乎在所有其他方面都能完美运行。

她在jfiddle

这是代码:

HTML:

<div id="form">
    <div id="topbox">
        <div class="countdown"></div>
        <div id="until">
            until move-in
        </div>
    </div>
</div>

JS:

$(document).ready(function() {

    //preload rollover image
    var image = $('<img />').attr('src', '../../images/countdown_button1.png');

    // jqueryUI calls for buttons
    $(".back a").button({
        icons: {primary: "ui-icon-triangle-1-w"}
    });

    // checklist button rollover
    $('#bottombox a').hover(
        function () {
            $('#bottombox').addClass("button").removeClass("nobutton");
        }, function () {
            $('#bottombox').addClass("nobutton").removeClass("button");
        }
    );

    // start instance of countdown
    $('.countdown').countdown({until: new Date(2014, 9-1, 21, 10), layout: 
        '<ul class="countdown-tabs"><li><a>{dn} <span>{dl}</span></a></li>' + 
        '<li><a>{hn} <span>{hl}</span></a></li>' + 
        '<li><a>{mn} <span>{ml}</span></a></li>' + 
        '<li class="last-child"><a>{sn} <span>{sl}</span></a></li></ul>'});

    $('.bg-switcher input').change(function () {
        // set background photo to value of photo-switcher
        window.location.hash = $(this).attr('id');
        var photo = "url('/images/countdown_" + $(this).attr('id') + ".jpg')";
        $('#canvas').css('background-image', photo);
    });

});

function setPhoto() {
    if(window.location.hash === "" || window.location.hash === "#one") {
        $('#one').attr("checked", "checked");
        $(".bg-switcher").buttonset();
    } else {
        // grab the value of the URL hash
        var urlHash = window.location.hash.substring(1);

        // set background photo to value in URL hash
        var urlPhoto = "url('/images/countdown_" + urlHash + ".jpg')";
        $('#canvas').css('background-image', urlPhoto);

        $('#' + urlHash).attr("checked", "checked");
        $(".bg-switcher").buttonset();
    }
};

我也在打电话:

<script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jqueryui/1.10.4/jquery-ui.min.js"></script>
<script type="text/javascript" src="/js/jquery.countdown.js"></script>
<script type="text/javascript" src="/js/jquery.plugin.js"></script>

有关如何让它倒计时的任何想法?欣赏它!

1 个答案:

答案 0 :(得分:0)

您不会像调用脚本的网站上所示调用实际的倒计时脚本:

  

〜2。下载并在页面的head部分中包含jQuery Countdown CSS和JavaScript。

<link rel="stylesheet" type="text/css" href="css/jquery.countdown.css"> 
<script type="text/javascript" src="js/jquery.plugin.js"></script> 
<script type="text/javascript" src="js/jquery.countdown.js"></script>

已编辑:除此之外,请检查浏览器的开发者工具是否存在错误,并尝试解决所有问题。它们可能与此无直接关系,但它们可能会阻止执行脚本的其余部分。