秒表倒计时
使用JavaScript實現秒表的倒計時。
我設置的是五分鐘倒計時，倒計時時間是可以自己隨意設置的。
效果圖
代碼演示
<!DOCTYPE html> <html><head><meta charset="utf-8" /><title></title></head><style>#timer{width: 400px;height: 120px;border: 1px solid red;text-align: center;background-color: cadetblue;}#one{width: 50px;height: 30px;margin-top: 10px;margin-left: 70px;float: left;font-size: 20px;border-radius: 10px;text-align: center;color: greenyellow;background-color: darkcyan;}.two{width: 50px;height: 30px;margin-top: 10px;margin-left: 15px;float: left;border-radius: 10px;font-size: 20px;text-align: center;color: greenyellow;background-color: darkcyan;}</style><body><!-- 5分鐘倒計時 --><div id="timer"><div id="one">h</div><div class="two">min</div><div class="two">s</div><div class="two">ms</div><span id="time" style="font-size: 3em">00:05:00:00</span></div></body><script type="text/javascript">var clock=document.getElementById("time");var start = clock.innerHTML;var finish = "00:00:00:00";var time = null;run();//定義時間函數，讓秒表每100ms變化一次function run() {time =setInterval("onTime()", 100);}function onTime(){if (start == finish){clearInterval(time);start="00:00:00:10";}//定義賦值var hms = new String(start).split(":");var ms = new Number(hms[3]);var s = new Number(hms[2]);var m = new Number(hms[1]);var h = new Number(hms[0]);ms -= 10;if (ms < 0){ms = 90;s -= 1;if (s < 0){s = 59;m -= 1;}if (m < 0){m = 59;h -= 1;}}//判斷如果是個位數前面加0var ms = ms < 10 ? ("0" + ms) : ms;var ss = s < 10 ? ("0" + s) : s;var sm = m < 10 ? ("0" + m) : m;var sh = h < 10 ? ("0" + h) : h;start = sh + ":" + sm + ":" + ss + ":" + ms;//在次賦值clock.innerHTML = start;}</script> </html>總結
- 上一篇： 大学生创业计划书（原创）
- 下一篇： 单词小助手——结构化程序设计