Java Script Clock : Clock : GUI Components : JavaScript DHTML examples (example source code) Organized by topic

JavaScript DHTML
C++
PHP
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.  JavaScript ClockHas Download File
2.  Fancy Clock
3.  Live image clockHas Download File
4.  Digital ClockHas Download File
5.  Military Clock
6.  Standard Clock
7.  Animation: clock
8.  Simulates a stop watch and displays the elapsed time
9.  Calendar with ClockHas Download File
























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