jquery制做精致的倒计时特效
本文实例为大家分享了jquery做一个小的倒计时效果的代码，供大家参考，具体内容如下
html：
<divid="shop_rec"> <ulclass="cf"> <li> <imgsrc="image/goods.jpg"alt="小米Note顶配版"/> <div> <h5>小米Note顶配版</h5> <p>全网通香槟金移动联通<br/>双4G手机双卡双待</p> <em>¥2998<i>起</i></em> <spanclass="time"data-starttime="1445982375"data-endtime="1446350400"></span> </div> </li> <li> <imgsrc="image/goods.jpg"alt="小米Note顶配版"/> <div> <h5>小米Note顶配版</h5> <p>全网通香槟金移动联通<br/>双4G手机双卡双待</p> <em>¥2998<i>起</i></em> <spanclass="time"data-starttime="1445912375"data-endtime="1436350400"></span> </div> </li> </ul> </div>
jquery：
$(function(){
varabj=$("#shop_rec"),
timeObj=abj.find('.time');
varstarttime=timeObj.data('starttime');
//定时器函数
functionactionDo(){
returnsetInterval(function(){
timeObj.each(function(index,el){
vart=$(this),
surplusTime=t.data('endtime')-starttime;
if(surplusTime<=0){
t.html("活动已经开始");
}else{
varyear=surplusTime/(24*60*60*365),
showYear=parseInt(year),
month=(year-showYear)*12,
showMonth=parseInt(month),
day=(month-showMonth)*30,
showDay=parseInt(day),
hour=(day-showDay)*24,
showHour=parseInt(hour),
minute=(hour-showHour)*60,
showMinute=parseInt(minute),
seconds=(minute-showMinute)*60,
showSeconds=parseInt(seconds);
t.html("");
if(showYear>0){
t.append("<span>"+showYear+"年</span>")
};
if(showMonth>0){
t.append("<span>"+showMonth+"月</span>")
};
if(showDay>0){
t.append("<span>"+showDay+"天</span>")
};
if(showHour>=0){
t.append("<span>"+showHour+"小时</span>")
};
if(showMinute>=0){
t.append("<span>"+showMinute+"分钟</span>")
};
if(showSeconds>=0){
t.append("<span>"+showSeconds+"秒</span>")
};
};
});
starttime++;
},1000);//设定执行或延时时间
};
//执行它
actionDo();
});
本文由FungLeo原创
本文地址：http://blog.csdn.net/fungleo/article/details/49446887
总结
不是特别优秀，但是小的应用完全没有问题。
精彩专题分享：
以上就是本文的全部内容，希望对大家的学习有所帮助。