DIV CSS 佈局教程網

 DIV+CSS佈局教程網 >> 網頁腳本 >> JavaScript入門知識 >> jQuery入門知識 >> JQuery特效代碼 >> jquery 顯示*天*時*分*秒實現時間計時器
jquery 顯示*天*時*分*秒實現時間計時器
編輯:JQuery特效代碼     
1.用jquery實現時間計時器,從之前的某個時間段到現在距離多少天多少時多少分多少秒?

html代碼:
. 代碼如下:
<div id="times_wrap" class="time_num">
距離現在時間:
<div class="time_w">
<span id="time_d" class="time"> </span >天
<span id="time_h" class="time"> </span >時
<span id="time_m" class="time"> </span >分
<span id="time_s" class="time"> </span >秒
</div>
</div>

<script type="text/javascript">
$(function(){

show_time();

});

function show_time(){
var time_start = new Date("2013/10/01 00:00:00").getTime();//設定開始時間
var time_end = new Date().getTime(); //設定結束時間(等於系統當前時間)
//計算時間差
var time_distance = time_end - time_start;
if(time_distance > 0){
// 天時分秒換算
var int_day = Math.floor(time_distance/86400000)
time_distance -= int_day * 86400000;

var int_hour = Math.floor(time_distance/3600000)
time_distance -= int_hour * 3600000;

var int_minute = Math.floor(time_distance/60000)
time_distance -= int_minute * 60000;

var int_second = Math.floor(time_distance/1000)
// 時分秒為單數時、前面加零
if(int_day < 10){
int_day = "0" + int_day;
}
if(int_hour < 10){
int_hour = "0" + int_hour;
}
if(int_minute < 10){
int_minute = "0" + int_minute;
}
if(int_second < 10){
int_second = "0" + int_second;
}
// 顯示時間
$("#time_d").html(int_day);
$("#time_h").html(int_hour);
$("#time_m").html(int_minute);
$("#time_s").html(int_second);

setTimeout("show_time()",1000);

}else{
$("#time_d").html('00');
$("#time_h").html('00');
$("#time_m").html('00');
$("#time_s").html('00');

}
}
</script>
XML學習教程| jQuery入門知識| AJAX入門| Dreamweaver教程| Fireworks入門知識| SEO技巧| SEO優化集錦|
Copyright © DIV+CSS佈局教程網 All Rights Reserved