[Beschreibung]
Eine Uhr, die dem Mauszeiger folgt.
[Kompatibilität]
[Code]
<script language="JavaScript"> <!-- Begin /* Silly Clock by kurt.grigg@virgin.net modified by N8i (www.nightfire.ch) */ CoLoUrS=new Array('fff000','00ff00','ff00ff'); //Clock face colours. sCol='ff00ff'; //seconds colour. mCol='00ff00'; //minutes colour. hCol='fff000'; //hours colour. //Alter nothing below! - ab hier nichts ändern!! //Browser Sniffer var ns4up = (document.layers) ? 1 : 0; var ie4up = (document.all) ? 1 : 0; var mozup = (!document.all && document.getElementById) ? 1 : 0; H='Hours..'; H=H.split(''); H=H.reverse(); M='Minutes..'; M=M.split(''); M=M.reverse(); S='Seconds..'; S=S.split(''); S=S.reverse(); dots=12; var Ypos=0,Xpos=0,Ybase=0,Xbase=0; var ay=0,ax=0,Ay=0,Ax=0,by=0,bx=0,By=0,Bx=0,cy=0,cx=0,Cy=0,Cx=0,dy=0,dx=0,Dy=0,Dx=0; count=0; count_a=0; move=1; viz=(ns4up)?'hide':'hidden'; if (ns4up) { for (i=0; i < dots; i++) document.write('<layer name=nface'+i+' top=0 left=0 bgcolor=#ffffff clip="0,0,3,3"></layer>'); for (i=0; i < S.length; i++) document.write('<layer name=nx'+i+' top=0 left=0 width=36 height=36><font face=Verdana size=2 color='+sCol+'><center>'+S[i]+'</center></font></layer>'); for (i=0; i < M.length; i++) document.write('<layer name=ny'+i+' top=0 left=0 width=36 height=36><font face=Verdana size=2 color='+mCol+'><center>'+M[i]+'</center></font></layer>'); for (i=0; i < H.length; i++) document.write('<layer name=nz'+i+' top=0 left=0 width=36 height=36><font face=Verdana size=2 color='+hCol+'><center>'+H[i]+'</center></font></layer>'); } if (ie4up) { document.write('<div id="W" style="position:absolute;top:0px;left:0px"><div style="position:relative">'); for (i=0; i < dots; i++){ document.write('<div id="face" style="position:absolute;top:0px;left:0px;width:3px;height:3px;font-size:3px;background:#ffffff"></div>'); } document.write('</div></div>'); document.write('<div id="X" style="position:absolute;top:0px;left:0px"><div style="position:relative">'); for (i=0; i < S.length; i++){ document.write('<div id="x" style="position:absolute;width:36px;height:36px;font-family:Verdana;font-size:12px;color:'+sCol+';text-align:center;padding-top:10px">'+S[i]+'</div>'); } document.write('</div></div>') document.write('<div id="Y" style="position:absolute;top:0px;left:0px"><div style="position:relative">'); for (i=0; i < M.length; i++){ document.write('<div id="y" style="position:absolute;width:36px;height:36px;font-family:Verdana;font-size:12px;color:'+mCol+';text-align:center;padding-top:10px">'+M[i]+'</div>'); } document.write('</div></div>') document.write('<div id="Z" style="position:absolute;top:0px;left:0px"><div style="position:relative">'); for (i=0; i < H.length; i++){ document.write('<div id="z" style="position:absolute;width:36px;height:36px;font-family:Verdana;font-size:12px;color:'+hCol+';text-align:center;padding-top:10px">'+H[i]+'</div>'); } document.write('</div></div>'); } if (mozup) { for (i=0; i < dots; i++){ document.write('<div id="face'+i+'" style="position:absolute;top:0px;left:0px;width:3px;height:3px;font-size:3px;background:#ffffff"></div>'); } for (i=0; i < S.length; i++){ document.write('<div id="x'+i+'" style="position:absolute;width:36px;height:36px;font-family:Verdana;font-size:12px;color:'+sCol+';text-align:center;padding-top:10px">'+S[i]+'</div>'); } for (i=0; i < M.length; i++){ document.write('<div id="y'+i+'" style="position:absolute;width:36px;height:36px;font-family:Verdana;font-size:12px;color:'+mCol+';text-align:center;padding-top:10px">'+M[i]+'</div>'); } for (i=0; i < H.length; i++){ document.write('<div id="z'+i+'" style="position:absolute;width:36px;height:36px;font-family:Verdana;font-size:12px;color:'+hCol+';text-align:center;padding-top:10px">'+H[i]+'</div>'); } } function handlerMM(e) { Xpos = (ns4up || mozup) ? e.pageX+100 : event.clientX+100; Ypos = (ns4up || mozup) ? e.pageY+100 : event.clientY+100; } if (ns4up) { window.captureEvents(Event.MOUSEMOVE); window.onMouseMove = handlerMM; } else { document.onmousemove = handlerMM; } function clock(){ time = new Date (); secs = time.getSeconds(); sec = -1.57 + Math.PI * secs/30; mins = time.getMinutes(); min = -1.57 + Math.PI * mins/30; hr = time.getHours(); hrs = -1.575 + Math.PI * hr/6+ Math.PI*parseInt(time.getMinutes())/360; Ybase=15; Xbase=15; if (ns4up) { document.layers["nx"+0].visibility = viz; document.layers["ny"+0].visibility = viz; document.layers["nz"+0].visibility = viz; for (i=0; i < S.length; i++){ document.layers["nx"+i].top=ay-12+(i*Ybase)*Math.sin(sec); document.layers["nx"+i].left=ax-12+(i*Xbase)*Math.cos(sec); } for (i=0; i < M.length; i++){ document.layers["ny"+i].top=by-12+(i*Ybase)*Math.sin(min); document.layers["ny"+i].left=bx-12+(i*Xbase)*Math.cos(min); } for (i=0; i < H.length; i++){ document.layers["nz"+i].top=cy-12+(i*Ybase)*Math.sin(hrs); document.layers["nz"+i].left=cx-12+(i*Xbase)*Math.cos(hrs); } for (i=0; i < dots; ++i){ document.layers["nface"+i].top=dy-2+(70*Math.sin(-0.49+dots+i/1.9)); document.layers["nface"+i].left=dx+4+(70*Math.cos(-0.49+dots+i/1.9)); } } if (ie4up) { var scrll=document.body.scrollTop; W.style.pixelTop=scrll; X.style.pixelTop=scrll; Y.style.pixelTop=scrll; Z.style.pixelTop=scrll; x[0].style.visibility=viz; y[0].style.visibility=viz; z[0].style.visibility=viz; for (i=0; i < S.length; i++){ x[i].style.pixelTop=ay-12+(i*Ybase)*Math.sin(sec); x[i].style.pixelLeft=ax-12+(i*Xbase)*Math.cos(sec); } for (i=0; i < M.length; i++){ y[i].style.pixelTop=by-12+(i*Ybase)*Math.sin(min); y[i].style.pixelLeft=bx-12+(i*Xbase)*Math.cos(min); } for (i=0; i < H.length; i++){ z[i].style.pixelTop=cy-12+(i*Ybase)*Math.sin(hrs); z[i].style.pixelLeft=cx-12+(i*Xbase)*Math.cos(hrs); } for (i=0; i < dots; ++i){ face[i].style.pixelTop=dy+6+(70*Math.sin(-0.49+dots+i/1.9)); face[i].style.pixelLeft=dx+4+(70*Math.cos(-0.49+dots+i/1.9)); } } if (mozup) { document.getElementById("x"+0).style.visibility = viz; document.getElementById("y"+0).style.visibility = viz; document.getElementById("z"+0).style.visibility = viz; for (i=0; i < S.length; i++){ document.getElementById("x"+i).style.top = ay-12+(i*Ybase)*Math.sin(sec); document.getElementById("x"+i).style.left = ax-12+(i*Xbase)*Math.cos(sec); } for (i=0; i < M.length; i++){ document.getElementById("y"+i).style.top = by-12+(i*Ybase)*Math.sin(min); document.getElementById("y"+i).style.left = bx-12+(i*Xbase)*Math.cos(min); } for (i=0; i < H.length; i++){ document.getElementById("z"+i).style.top = cy-12+(i*Ybase)*Math.sin(hrs); document.getElementById("z"+i).style.left = cx-12+(i*Xbase)*Math.cos(hrs); } for (i=0; i < dots; ++i){ document.getElementById("face"+i).style.top = dy-2+(70*Math.sin(-0.49+dots+i/1.9)); document.getElementById("face"+i).style.left = dx+4+(70*Math.cos(-0.49+dots+i/1.9)); } } } function MouseFollow(){ ay=Math.round(Ay+=((Ypos)-Ay)*4/15); ax=Math.round(Ax+=((Xpos)-Ax)*4/15); by = Math.round(By+=(ay-By)*4/15); bx = Math.round(Bx+=(ax-Bx)*4/15); cy = Math.round(Cy+=(by-Cy)*4/15); cx = Math.round(Cx+=(bx-Cx)*4/15); dy = Math.round(Dy+=(cy-Dy)*4/15); dx = Math.round(Dx+=(cx-Dx)*4/15); clock(); setTimeout('MouseFollow()',10); } function colourStep(){ count+=move; if (count >= dots) {count=0;count_a+=move} if (count_a == CoLoUrS.length) count_a=0; if (ns4up) document.layers["nface"+count].bgColor=CoLoUrS[count_a]; if (ie4up) face[count].style.background=CoLoUrS[count_a]; if (mozup) document.getElementById("face"+count).style.backgroundColor=CoLoUrS[count_a]; setTimeout('colourStep()',100) } function StartAll(){ MouseFollow(); colourStep(); } if (ns4up || ie4up || mozup) window.onload=StartAll; //--> </script>
Kurt Grigg modified by N8i (www.nightfire.ch)
Kopieren Sie bitte den Scriptcode