User Tools

Site Tools


simple_javascript_clock

Differences

This shows you the differences between two versions of the page.

Link to this comparison view

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>&nbsp;</span>+ <span style="" id=clock>&nbsp;</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