simple_javascript_clock
Differences
This shows you the differences between two versions of the page.
|
simple_javascript_clock [2009/05/05 10:42] tkbletsc created |
simple_javascript_clock [2009/05/05 10:59] (current) tkbletsc |
||
|---|---|---|---|
| Line 1: | Line 1: | ||
| <code> | <code> | ||
| + | |||
| + | |||
| <html> | <html> | ||
| <head> | <head> | ||
| Line 11: | Line 13: | ||
| } | } | ||
| - | function updateClock ( ) | + | function getTimeFormatted() { |
| - | { | + | |
| var now = new Date ( ); | var now = new Date ( ); | ||
| Line 33: | Line 34: | ||
| else if (h==0) h=12; | else if (h==0) h=12; | ||
| - | //var time_string = dows[dow] + " " + year + "-" + pad(mon,2) + "-" + pad(day,2) + " " + h + ":" + pad(m,2) + ":" + pad(s,2) + "." + pad(ms,3); | + | //return dows[dow] + " " + year + "-" + pad(mon,2) + "-" + pad(day,2) + " " + h + ":" + pad(m,2) + ":" + pad(s,2) + "." + pad(ms,3); |
| - | var time_string = dows[dow] + " " + year + "-" + pad(mon,2) + "-" + pad(day,2) + " " + h + ":" + pad(m,2) + ampm; | + | return dows[dow] + " " + year + "-" + pad(mon,2) + "-" + pad(day,2) + " " + h + ":" + pad(m,2) + ampm; |
| - | document.getElementById("clock").firstChild.nodeValue = time_string; | + | } |
| + | |||
| + | function updateClock ( ) { | ||
| + | var now = new Date ( ); | ||
| + | |||
| + | var s = now.getSeconds ( ); | ||
| + | var ms = now.getMilliseconds(); | ||
| + | |||
| + | document.getElementById("clock").firstChild.nodeValue = getTimeFormatted(); | ||
| // wait til the next minute + 500ms, that way we only update the clock on minute change | // wait til the next minute + 500ms, that way we only update the clock on minute change | ||
| - | // (for second-accuracy, use wait = 1000-ms) | + | // (for second-accuracy, use wait = 1000-ms+100) |
| var wait = 60000 - (1000*s+ms) + 500; | var wait = 60000 - (1000*s+ms) + 500; | ||
| + | //var wait = 1000-ms+100; | ||
| setTimeout('updateClock()', wait ); | setTimeout('updateClock()', wait ); | ||
| } | } | ||
| + | |||
| // --> | // --> | ||
| </script> | </script> | ||
| </head> | </head> | ||
| - | <body onload="updateClock();"> | + | <body> |
| - | <span id=clock> </span> | + | <span style="" id=clock> </span> |
| + | <script> | ||
| + | updateClock(); | ||
| + | document.getElementById("clock").title = "Page loaded: " + getTimeFormatted(); | ||
| + | </script> | ||
| </body> | </body> | ||
| </html> | </html> | ||
| + | |||
| + | |||
| + | |||
| </code> | </code> | ||
simple_javascript_clock.txt · Last modified: 2009/05/05 10:59 by tkbletsc
Page Tools
