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