倒计时

HTML

 < div class ="countdown pull-right">
            <span> 距预约结束时间还有 </span>
            <div class="day">
                <div class="dd"></div>
                <div> 天</div >
            </div>
            <div class="day">
                <div class="hh"></div>
                <div> 时</div >
            </div>
            <div class="day">
                <div class="mm"></div>
                <div> 分</div >
            </div>
            <div class="day">
                <div class="ss"></div>
                <div> 秒</div >
            </div>
  </div>

js

$(document).ready( function ()
{
    AnniversaryMgr.InitPageEvent();
});

var AnniversaryMgr = {

DifferenceHour: -1,
DifferenceMinute: -1,
DifferenceSecond: -1,
ExpireDate: new Date("Jun 28, 2015 23:59:59" ),   //**倒计时时间点-注意格式
daysms: 24 * 60 * 60 * 1000,
hoursms: 60 * 60 * 1000,
Secondms: 60 * 1000,
microsecond: 1000,
num: $( "#anniversary .festivity .right-text>span" ),
people: null,
countdown: null,
InitPageEvent: function ()
{
    AnniversaryMgr.countdown = setInterval(AnniversaryMgr.Clock, 1000)
},

Clock: function ()
{
    var nowDate = new Date();
    var convertHour = AnniversaryMgr.DifferenceHour
    var convertMinute = AnniversaryMgr.DifferenceMinute
    var convertSecond = AnniversaryMgr.DifferenceSecond
    var diffms = AnniversaryMgr.ExpireDate.getTime() - nowDate.getTime()

    AnniversaryMgr.DifferenceHour = Math.floor(diffms / AnniversaryMgr.daysms);
    diffms -= AnniversaryMgr.DifferenceHour * AnniversaryMgr.daysms;
    AnniversaryMgr.DifferenceMinute = Math.floor(diffms / AnniversaryMgr.hoursms);
    diffms -= AnniversaryMgr.DifferenceMinute * AnniversaryMgr.hoursms;
    AnniversaryMgr.DifferenceSecond = Math.floor(diffms / AnniversaryMgr.Secondms);
    diffms -= AnniversaryMgr.DifferenceSecond * AnniversaryMgr.Secondms;

    var dSecs = Math.floor(diffms / AnniversaryMgr.microsecond);
    if (convertHour != AnniversaryMgr.DifferenceHour) $("#anniversary .day .dd").text(AnniversaryMgr.DifferenceHour);
    if (convertMinute != AnniversaryMgr.DifferenceMinute) $("#anniversary .day .hh").text(AnniversaryMgr.DifferenceMinute);
    if (convertSecond != AnniversaryMgr.DifferenceSecond) $("#anniversary .day .mm").text(AnniversaryMgr.DifferenceSecond);

    $( "#anniversary .day .ss" ).text(dSecs);

    if (nowDate > AnniversaryMgr.ExpireDate) {
        $( "#anniversary .day .dd" ).text("0");
        $( "#anniversary .day .hh" ).text("0");
        $( "#anniversary .day .mm" ).text("0");
        $( "#anniversary .day .ss" ).text("0");
        clearInterval(AnniversaryMgr.countdown);
    }
}
}
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容