Announcement

Collapse
No announcement yet.

Helpful JavaScript for WEB DEV

Collapse
X
 
  • Filter
  • Time
  • Show
Clear All
new posts

  • Helpful JavaScript for WEB DEV

    Live Clock using images

    Uses images to display a clock.... detail at JavaScriptBank.com - 2.000+ free JavaScript codes


    How to setup

    Step 1: Place JavaScript below in your HEAD section
    JavaScript
    Code:
    <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.images) return;
        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 > 12) hours = 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>
        <!--
            This script downloaded from www.JavaScriptBank.com
            Come to view and download over 2000+ free javascript at www.JavaScriptBank.com
        -->
    Step 2: Place HTML below in your BODY section
    HTML
    Code:
    [IMG]http://forums.tweaktown.com/digitblank.gif[/IMG][IMG]http://forums.tweaktown.com/digitblank.gif[/IMG][IMG]http://forums.tweaktown.com/digitblank.gif[/IMG][IMG]http://forums.tweaktown.com/digitblank.gif[/IMG][IMG]http://forums.tweaktown.com/digitblank.gif[/IMG][IMG]http://forums.tweaktown.com/digitblank.gif[/IMG]
        <!--
            This script downloaded from www.JavaScriptBank.com
            Come to view and download over 2000+ free javascript at www.JavaScriptBank.com
        -->
    Step 3: must download files below
    Files
    Live_Clock_using_images.zip






Working...
X