JQuery倒计时代码(显示天数小时分钟秒数)[9361阅/1回]

一个js倒计时代码，可倒计算天、小时、分钟和秒数。使用了jquery插件来实现，里面的背景是一张图片。转自源码爱好者

<style>
#tips1{
color:grey;font-size:16px;margin-bottom:5px;
text-align:left;margin-left:3px;
}
#tips1 b{
font-size:17px;color:green;
}
.colockbox{width:250px;height:30px;background:url(http://www.codefans.net/jscss/demoimg/201312/colockbg.png) no-repeat;overflow: hidden; color:#000000;
margin-left:10px;
}
.colockbox span{float:left;display:block;width:40px;height:29px;line-height:29px;font-size:20px; font-weight:bold;text-align:center;color:#ffffff; margin-right:22px;}
</style>
<script type="text/javascript" src="http://www.codefans.net/ajaxjs/jquery-1.6.2.min.js"></script>
<script type="text/javascript">
$(function(){
   countDown("2014/1/1 00:00:00","#colockbox1");
});
function countDown(time,id){
   var day_elem = $(id).find('.day');
   var hour_elem = $(id).find('.hour');
   var minute_elem = $(id).find('.minute');
   var second_elem = $(id).find('.second');
   var end_time = new Date(time).getTime(),//月份是实际月份-1
   sys_second = (end_time-new Date().getTime())/1000;
   var timer = setInterval(function(){
      if (sys_second > 1) {
         sys_second -= 1;
         var day = Math.floor((sys_second / 3600) / 24);
         var hour = Math.floor((sys_second / 3600) % 24);
         var minute = Math.floor((sys_second / 60) % 60);
         var second = Math.floor(sys_second % 60);
         day_elem && $(day_elem).text(day);//计算天
         $(hour_elem).text(hour<10?"0"+hour:hour);//计算小时
         $(minute_elem).text(minute<10?"0"+minute:minute);//计算分钟
         $(second_elem).text(second<10?"0"+second:second);//计算秒杀
      } else {
         clearInterval(timer);
      }
   }, 1000);
}
</script>
<div id="tips1">距离<b>2014年01月01日</b>还有:</div><div class="colockbox" id="colockbox1"><span class="day">00</span> <span class="hour">00</span> <span class="minute">00</span> <span class="second">00</span> </div>



WAP开源论坛

<style>
#tips1{
color:grey;font-size:16px;margin-bottom:5px;
text-align:left;margin-left:3px;
}
#tips1 b{
font-size:17px;color:green;
}
.colockbox{width:250px;height:30px;background:url(http://www.codefans.net/jscss/demoimg/201312/colockbg.png) no-repeat;overflow: hidden; color:#000000;
margin-left:10px;
}
.colockbox span{float:left;display:block;width:40px;height:29px;line-height:29px;font-size:20px; font-weight:bold;text-align:center;color:#ffffff; margin-right:22px;}
</style>
<script type="text/javascript" src="http://www.codefans.net/ajaxjs/jquery-1.6.2.min.js"></script>
<script type="text/javascript">
$(function(){
   countDown("2014/1/1 00:00:00","#colockbox1");
});
function countDown(time,id){
   var day_elem = $(id).find('.day');
   var hour_elem = $(id).find('.hour');
   var minute_elem = $(id).find('.minute');
   var second_elem = $(id).find('.second');
   var end_time = new Date(time).getTime(),//月份是实际月份-1
   sys_second = (end_time-new Date().getTime())/1000;
   var timer = setInterval(function(){
      if (sys_second > 1) {
         sys_second -= 1;
         var day = Math.floor((sys_second / 3600) / 24);
         var hour = Math.floor((sys_second / 3600) % 24);
         var minute = Math.floor((sys_second / 60) % 60);
         var second = Math.floor(sys_second % 60);
         day_elem && $(day_elem).text(day);//计算天
         $(hour_elem).text(hour<10?"0"+hour:hour);//计算小时
         $(minute_elem).text(minute<10?"0"+minute:minute);//计算分钟
         $(second_elem).text(second<10?"0"+second:second);//计算秒杀
      } else {
         clearInterval(timer);
      }
   }, 1000);
}
</script>
<div id="tips1">距离<b>2014年01月01日</b>还有:</div><div class="colockbox" id="colockbox1"><span class="day">00</span> <span class="hour">00</span> <span class="minute">00</span> <span class="second">00</span> </div>

这家伙很懒，什么也没留下！