»
EnglishFrenchVietnamese

Print - Analog Clock v2 script - JavaScriptBank.com

Full version: jsB@nk » Time » Clock » Analog Clock v2 script
URL: https://www.javascriptbank.com/analog-clock-v2-script.html

Analog Clock v2 script © JavaScriptBank.comThis DHTML Clock follows the mouse cursor around the page.

Full version: jsB@nk » Time » Clock » Analog Clock v2 script
URL: https://www.javascriptbank.com/analog-clock-v2-script.html



JavaScript
<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 numbers=new Array();var txt=(ns4)? '<layer name="outer" height="117" width="117">' : '<div id="outer" style="position:absolute; width:117px; height:117px; visibility:visible">';for(i=1;i<=7;i++)txt+=(ns4)? '<layer name="sec'+i+'" top="-100" left="0" bgcolor="black" width="6" height="6"></layer>' : '<div id="sec'+i+'" style="position:absolute; top:-100px; left:-100px; width:6px; height:6px; background-color:black; font-size:6px;"></div>';for(i=1;i<=6;i++)txt+=(ns4)? '<layer name="min'+i+'" top="-100" left="0" bgcolor="blue" width="6" height="6"></layer>' : '<div id="min'+i+'" style="position:absolute; top:-100px; left:-100px; width:6px; height:6px; background-color:blue; font-size:6px;"></div>';for(i=1;i<=5;i++)txt+=(ns4)? '<layer name="hrs'+i+'" top="-100" left="0" bgcolor="red" width="6" height="6"></layer>' : '<div id="hrs'+i+'" style="position:absolute; top:-100px; left:-100px; width:6px; height:6px; background-color:red; font-size:6px;"></div>';for(i=1;i<=12;i++)txt+=(ns4)? '<layer name="h'+i+'" top="-100" width="10" height="10"><font size="2">'+i+'</font></layer>' : '<div id="h'+i+'" style="position:absolute; top:-100px; left:0px; width:10px; height:10px; font-size:10pt;">'+i+'</div>';txt+=(ns4)? '</layer>' : '</div>';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<hours.length;n++)moveid(hours[n], ringX[n][now.hrs], ringY[n][now.hrs]);for(n=0;n<minutes.length;n++)moveid(minutes[n], ringX[n][now.min], ringY[n][now.min]);for(n=0;n<seconds.length;n++)moveid(seconds[n], ringX[n][now.sec], ringY[n][now.sec]);}function moveid(id,x,y){if(ns4)id.moveTo(x,y);else{id.style.left=x+'px';id.style.top=y+'px';}}function moveobj(evt){mx=(ie4||ie5)? event.clientX+document.body.scrollLeft: evt.pageX;my=(ie4||ie5)? event.clientY+document.body.scrollTop: evt.pageY;moveid(outer,mx+5,my+5);}// FUNCTION TO FIND NESTED LAYERS IN NS4 BY MIKE HALLfunction findlayer(name,doc){var i,layer;for(i=0;i<doc.layers.length;i++){layer=doc.layers[i];if(layer.name==name)return layer;if(layer.document.layers.length>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);  for(i=1;i<=12;i++)numbers[i]=getid('h'+i);  for(n=1;n<=12;n++)moveid(numbers[n], ringX[7][n-1], ringY[7][n-1]);  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);  if(ns4)document.captureEvents(Event.MOUSEMOVE);  document.onmousemove=moveobj;}window.onresize=function(){  if(ns4)setTimeout('history.go(0)',300);}</script><!--    This script downloaded from www.JavaScriptBank.com    Come to view and download over 2000+ free javascript at www.JavaScriptBank.com-->