Phiên bản đầy đủ: jsB@nk » Thời gian » Đồng hồ đếm giờ
URL: https://www.javascriptbank.com/time-keeper-script.html
Hiệu ứng sẽ tạo ra một đồng hồ bấm giờ có hiển thị ngày tháng.
Phiên bản đầy đủ: jsB@nk » Thời gian » Đồng hồ đếm giờ
URL: https://www.javascriptbank.com/time-keeper-script.html
<style type="text/css">body { font-family:verdana,arial,helvetica,sans-serif; font-size:12px; color:#000000; background:#ffffff; margin:0px; padding:10px;}p { font-family:verdana,arial,helvetica,sans-serif; font-size:12px; color:#000000; background:transparent;}pre { font-family:monospace; font-size:12px; color:#000099; background:transparent;}h1 { font-family:verdana,arial,helvetica,sans-serif; font-size:18px; color:#000000; background:transparent;}h2 { font-family:verdana,arial,helvetica,sans-serif; font-size:16px; color:#000000; background:transparent;}div { text-align: left; font-family:verdana,arial,helvetica,sans-serif; font-size:12px; color:#000000; background:#eeeeee; margin:10px; padding:10px; border-left:1px solid #cccccc; border-top:1px solid #cccccc; border-right:1px solid #000000; border-bottom:1px solid #000000;}.floatLeft { float:left;}.mono { font-family:monospace; font-size:12px;}</style><!-- This script downloaded from www.JavaScriptBank.com Come to view and download over 2000+ free javascript at www.JavaScriptBank.com--><script type="text/javascript">var tk = new Array(); // array of TimeKeeper objectswindow.onload = function() { setTimeout("timerTick()", 500);}function timerTick() { setTimeout("timerTick()", 500); var i, dt = new Date(); for (i=0; i<tk.length; ++i) { if (tk[i].enable) { tk[i].form.txtElapsed.value = ms2hms((dt - tk[i].begin) + tk[i].elapsed); } }}function TimeKeeper() { // Object Constructor // Properties this.enable = false; this.elapsed = 0; this.form = null; this.begin = null; // Methods this.start = function() { if (!this.enable) { this.begin = new Date(); if (!this.elapsed) { this.form.txtHistory.value += "Begin Session..." + "\n"; } this.form.txtHistory.value += "Start: " + this.begin.toLocaleString() + "\n"; this.enable = true; } } this.stop = function() { if (this.enable) { this.enable = false; var dt = new Date(); this.elapsed += dt - this.begin; this.form.txtHistory.value += "Stop: " + dt.toLocaleString() + "\n"; this.form.txtHistory.value += "Elapsed: " + ms2hms(this.elapsed) + "\n"; this.form.txtElapsed.value = ms2hms(this.elapsed); } } this.reset = function() { this.stop(); if (this.elapsed != 0 || this.begin != null) { this.elapsed = 0; this.begin = null; this.form.txtHistory.value += "...End Session" + "\n\n"; } }}function ms2hms(ms) { var time = new Date(ms); var hour = time.getUTCHours(); var minute = time.getUTCMinutes(); var second = time.getUTCSeconds(); var temp = "" + hour; temp += "h " + ((minute < 10) ? "0" : "") + minute; temp += "m " + ((second < 10) ? "0" : "") + second; temp += "s"; return temp;}function createTimeKeeper(title) { var i = tk.length; var tkHtml = "<div class='floatLeft'>" +" <h2>" + title + "</h2>" +" <form name='f" + i + "' onsubmit='return false'>" +" <table>" +" <tr><td>" +" <input type='button' value='Start' onclick='tk[" + i + "].start()'>" +" <input type='button' value='Stop' onclick='tk[" + i + "].stop()'>" +" <input type='button' value='End Session' onclick='tk[" + i + "].reset()'>" +" Elapsed <input type='text' name='txtElapsed' size='12' class='mono'>" +" </td></tr>" +" <tr><td><textarea name='txtHistory' rows='10' cols='51' class='mono'></textarea></td></tr>" +" </table>" +" </form>" +"</div>"; document.write(tkHtml); tk[i] = new TimeKeeper(); tk[i].form = document.forms("f"+i); tk[i].form.txtHistory.value = ""; tk[i].form.txtElapsed.value = 0;}</script><!-- This script downloaded from www.JavaScriptBank.com Come to view and download over 2000+ free javascript at www.JavaScriptBank.com--><div><h1>Time Keeper</h1></div><script type="text/javascript"> createTimeKeeper("Big Money Project"); createTimeKeeper("Little Money Project");</script><div class="floatLeft"> <h2>Big Money Project</h2> <form name="f0" onsubmit="return false"> <table> <tbody><tr><td> <input type="button" value="Start" onclick="tk[0].start()"> <input type="button" value="Stop" onclick="tk[0].stop()"> <input type="button" value="End Session" onclick="tk[0].reset()"> Elapsed <input type="text" name="txtElapsed" size="12" class="mono"> </td></tr> <tr><td><textarea name="txtHistory" rows="10" cols="51" class="mono"></textarea></td></tr> </tbody></table> </form></div><!-- This script downloaded from www.JavaScriptBank.com Come to view and download over 2000+ free javascript at www.JavaScriptBank.com-->