Java Script Clock : JavaScript DHTML examples (example source code) » GUI Components » Clock

JavaScript DHTML
C++
Java Products
Java Articles
JavaScript DHTML Home  »   GUI Components   » [  Clock  ]   
 



Java Script Clock

Please note that some example is only working under IE or Firefox.

<html>
<head>
<title>Java Script Clock</title>

<BR>
<BR>
<BR>
<CENTER>
    <IMG SRC="digitblank.gif" border=name="hourstens">
    <IMG SRC="digitblank.gif" border=name="hoursones">
    <IMG SRC="digitblank.gif" border=name="colon">
    <IMG SRC="digitblank.gif" border=name="minstens">
    <IMG SRC="digitblank.gif" border=name="minsones">
    <IMG SRC="digitblank.gif" border=name="ampm">
</center>


<SCRIPT LANGUAGE="JavaScript">

  if (document.images) { 
    digit1 = new Image; 
    digit1.src = "digit1.gif"
  digit2 = new Image; 
    digit2.src = "digit2.gif";
  digit3 = new Image; 
    digit3.src = "digit3.gif";
  digit4 = new Image; 
    digit4.src = "digit4.gif";
  digit5 = new Image; 
    digit5.src = "digit5.gif";
  digit6 = new Image; 
    digit6.src = "digit6.gif";
  digit7 = new Image; 
    digit7.src = "digit7.gif";
  digit8 = new Image; 
    digit8.src = "digit8.gif";
  digit9 = new Image; 
    digit9.src = "digit9.gif";
  digit0 = new Image; 
    digit0.src = "digit0.gif";
  digitam = new Image; 
    digitam.src = "digitam.gif";
  digitpm = new Image; 
    digitpm.src = "digitpm.gif";
  digitcolon = new Image;
  digitcolon.src = "digitcolon.gif";
  digitblank = new Image;
  digitblank.src = "digitblank.gif";
  }
function UpdateClock(){
    var time= new Date();
    hours = time.getHours();
    mins = time.getMinutes();
    if (!document.imagesreturn;
  digit = mins % 10;
    document.images.minsones.src=eval("digit"+digit+".src");
  digit = (mins - (mins % 10))/10;
  document.images.minstens.src=eval("digit"+digit+".src");
  if (hours > 12)
    document.images.ampm.src=digitpm.src;
  else
    document.images.ampm.src=digitam.src;
  if (hours > 12hours = hours - 12;
  digit = hours % 10;
  document.images.hoursones.src=eval("digit"+digit+".src");
  digit = (hours - (hours % 10))/10;
  document.images.hourstens.src=eval("digit"+digit+".src");
  document.images.colon.src=digitcolon.src;
  setTimeout("UpdateClock()",30000);

  }

   UpdateClock();
</SCRIPT>
</body>
</html>
Download: imageclock.zip   (3  K)  
Related examples in the same category
1.  Fancy Clock
2.  Live image clock
3.  Digital Clock
4.  Military Clock
5.  Standard Clock
6.  Animation: clock
7.  Simulates a stop watch and displays the elapsed time








Home| Contact Us
Copyright 2003 - 04 Demo Source and Support. All rights reserved.
All other trademarks are property of their respective owners.