您的位置：首页 > Web前端 > JQuery

活动倒计时代码（精确到毫秒）jquery插件

2015-06-25 16:19 701 查看

<!DOCTYPE html>

<html>

<head>

<meta charset="utf-8">

<title>活动倒计时代码（精确到毫秒）jquery插件 - 懒人建站 http://www.51xuediannao.com/</title>
</head>

<body>

<script type="text/javascript" src="http://libs.useso.com/js/jquery/1.11.1/jquery.min.js"></script>

<script type="text/javascript">

$.extend($.fn,{

//懒人建站 http://www.51xuediannao.com/
fnTimeCountDown:function(d){

this.each(function(){

var $this = $(this);

var o = {

hm: $this.find(".hm"),

sec: $this.find(".sec"),

mini: $this.find(".mini"),

hour: $this.find(".hour"),

day: $this.find(".day"),

month:$this.find(".month"),

year: $this.find(".year")

};

var f = {

haomiao: function(n){

if(n < 10)return "00" + n.toString();

if(n < 100)return "0" + n.toString();

return n.toString();

},

zero: function(n){

var _n = parseInt(n, 10);//解析字符串,返回整数

if(_n > 0){

if(_n <= 9){

_n = "0" + _n

}

return String(_n);

}else{

return "00";

}

},

dv: function(){

//d = d || Date.UTC(2050, 0, 1); //如果未定义时间，则我们设定倒计时日期是2050年1月1日

var _d = $this.data("end") || d;

var now = new Date(),

endDate = new Date(_d);

//现在将来秒差值

//alert(future.getTimezoneOffset());

var dur = (endDate - now.getTime()) / 1000 , mss = endDate - now.getTime() ,pms = {

hm:"000",

sec: "00",

mini: "00",

hour: "00",

day: "00",

month: "00",

year: "0"

};

if(mss > 0){

pms.hm = f.haomiao(mss % 1000);

pms.sec = f.zero(dur % 60);

pms.mini = Math.floor((dur / 60)) > 0? f.zero(Math.floor((dur / 60)) % 60) : "00";

pms.hour = Math.floor((dur / 3600)) > 0? f.zero(Math.floor((dur / 3600)) % 24) : "00";

pms.day = Math.floor((dur / 86400)) > 0? f.zero(Math.floor((dur / 86400)) % 30) : "00";

//月份，以实际平均每月秒数计算

pms.month = Math.floor((dur / 2629744)) > 0? f.zero(Math.floor((dur / 2629744)) % 12) : "00";

//年份，按按回归年365天5时48分46秒算

pms.year = Math.floor((dur / 31556926)) > 0? Math.floor((dur / 31556926)) : "0";

}else{

pms.year=pms.month=pms.day=pms.hour=pms.mini=pms.sec="00";

pms.hm = "000";

//alert('结束了');

return;

}

return pms;

},

ui: function(){

if(o.hm){

o.hm.html(f.dv().hm);

}

if(o.sec){

o.sec.html(f.dv().sec);

}

if(o.mini){

o.mini.html(f.dv().mini);

}

if(o.hour){

o.hour.html(f.dv().hour);

}

if(o.day){

o.day.html(f.dv().day);

}

if(o.month){

o.month.html(f.dv().month);

}

if(o.year){

o.year.html(f.dv().year);

}

setTimeout(f.ui, 1);

}

};

f.ui();

});

}

});

</script>

<div style="padding: 50px;">活动倒计时代码（精确到毫秒）jquery插件 - <a href="http://www.51xuediannao.com/js/jquery/">jquery插件</a>懒人建站：http://www.51xuediannao.com/</div>

<div style="background:rgb(183,17,41); WIDTH: 100%; color:#fff;FONT-FAMILY: arial; TEXT-ALIGN: center;">

<P style="font-size:.8em;line-height:2em;">距活动结束还有：</P>

<div id="fnTimeCountDown" data-end="2018/07/08 18:45:13">

<span class="year">00</span>年

<span class="month">00</span>月

<span class="day">00</span>天

<span class="hour">00</span>时

<span class="mini">00</span>分

<span class="sec">00</span>秒

<span class="hm">000</span>

</div>

</div>

<script type="text/javascript">

$("#fnTimeCountDown").fnTimeCountDown("2018/07/08 18:45:13");

</script>

</body>

</html>

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理 点击这里给我发消息
标签： 
相关文章推荐
新的分享
章节导航