Analog DHTML Clock
Instructions:
1: Copy and paste the following javascript in your BODY tag wherever you want to clock to be placed. For example, if you want the clock to be in a table cell, just paste the code in a cell; If you want it centered in a page, just enclose the code in a set of CENTER tags; etc.
Select all...
<script language="javascript"> ns4 = (navigator.appName.indexOf("Netscape")>=0 && document.layers)? true : false; ie4 = (document.all && !document.getElementById)? true : false; ie5 = (document.all && document.getElementById)? true : false; ns6 = (document.getElementById && navigator.appName.indexOf("Netscape")>=0 )? true: false; var mx=0; var my=0; var outer; var now=new Date(); var ringX=new Array(); var ringY=new Array(); ringX[7]=[80,94,100,94,77,53,28,11,5,11,28,53]; ringY[7]=[8,26,50,74,91,97,91,74,50,26,8,2]; var hours=new Array(); var minutes=new Array(); var seconds=new Array(); var txt=(ns4)? '
' : '
'; txt+='
'; for(i=1;i<=7;i++)txt+=(ns4)? '
' : '
'; for(i=1;i<=6;i++)txt+=(ns4)? '
' : '
'; for(i=1;i<=5;i++)txt+=(ns4)? '
' : '
'; txt+=(ns4)? '
' : ''; document.write(txt); function runclock(){ now=new Date(); now.hrs=now.getHours(); now.min=now.getMinutes(); now.sec=now.getSeconds(); if(now.hrs==12)now.hrs=0; now.hrs=(now.hrs>12)? now.hrs-12 : now.hrs; now.hrs=Math.floor((now.hrs*5)+(now.min/12)); for(n=0;n
0)if((layer=findlayer(name,layer.document))!=null)return layer; } return null; } function getid(idstr){ if(ns4) return findlayer(idstr, document); if(ie4) return document.all[idstr]; else return document.getElementById(idstr); } window.onload=function(){ for(i=1;i<=5;i++)hours[i-1]=getid('hrs'+i); for(i=1;i<=6;i++)minutes[i-1]=getid('min'+i); for(i=1;i<=7;i++)seconds[i-1]=getid('sec'+i); outer=getid('outer'); var cnt=[0]; var radius=6; var result=new Array(); for(i=1;i<=60;i++){ cnt[i]=cnt[i-1]+((Math.PI*2)/60); cnt[i-1]+=Math.PI/180; } for(num=0;num<=6;num++){ ringX[num]=new Array(); ringY[num]=new Array(); for(i=1;i<=60;i++){ result=((i-15)<0)? 60+i-15 : i-15; ringX[num][i]=Math.floor((num*radius*Math.cos(cnt[result]))+56); ringY[num][i]=Math.floor((num*radius*Math.sin(cnt[result]))+55); } ringX[num][0]=ringX[num][60]; ringY[num][0]=ringY[num][60]; } setInterval('runclock()',100); } window.onresize=function(){ if(ns4)setTimeout('history.go(0)',300); } </script>
2: Make sure you also save this image to your server. Just right click the image and select the option to save it: