标题 | 随鼠标移动的时钟非常漂亮遗憾的是只支持IE |
范文 | 新建一个文本文件,将下面的代码复制进去,将文件名字改为clock.html运行即可。 001 <SCRIPT language=JavaScript><!-- 002 dCol='0000FF';//date colour. 003 fCol='0000FF';//face colour. 004 sCol='0000FF';//seconds colour. 005 mCol='0000FF';//minutes colour. 006 hCol='0000FF';//hours colour. 007 ClockHeight=40; 008 ClockWidth=40; 009 ClockFromMouseY=0; 010 ClockFromMouseX=100; 011 //Alter nothing below! Alignments will be lost! 012 d=new Array("SUNDAY","MONDAY","TUESDAY","WEDNESDAY","THURSDAY","FRIDAY","SATURDAY"); 013 m=new Array("JANUARY","FEBRUARY","MARCH","APRIL","MAY","JUNE","JULY","AUGUST","SEPTEMBER","OCTOBER","NOVEMBER","DECEMBER"); 014 date=new Date(); 015 day=date.getDate(); 016 year=date.getYear(); 017 if (year < 2000) year=year+1900; 018 TodaysDate=" "+d[date.getDay()]+" "+day+" "+m[date.getMonth()]+" "+year; 019 D=TodaysDate.split(''); 020 H='...'; 021 H=H.split(''); 022 M='....'; 023 M=M.split(''); 024 S='.....'; 025 S=S.split(''); 026 Face='1 2 3 4 5 6 7 8 9 10 11 12'; 027 font='Arial'; 028 size=1; 029 speed=0.5; 030 ns=(document.layers); 031 ie=(document.all); 032 Face=Face.split(' '); 033 n=Face.length; 034 a=size*10; 035 ymouse=0; 036 xmouse=0; 037 scrll=0; 038 props="<font face="+font+" size="+size+" color="+fCol+"><B>"; 039 props2="<font face="+font+" size="+size+" color="+dCol+"><B>"; 040 Split=360/n; 041 Dsplit=360/D.length; 042 HandHeight=ClockHeight/4.5 043 HandWidth=ClockWidth/4.5 044 HandY=-7; 045 HandX=-2.5; 046 scrll=0; 047 step=0.06; 048 currStep=0; 049 y=new Array();x=new Array();Y=new Array();X=new Array(); 050 for (i=0; i < n; i++){y[i]=0;x[i]=0;Y[i]=0;X[i]=0} 051 Dy=new Array();Dx=new Array();DY=new Array();DX=new Array(); 052 for (i=0; i < D.length; i++){Dy[i]=0;Dx[i]=0;DY[i]=0;DX[i]=0} 053 if (ns){ 054 for (i=0; i < D.length; i++) 055 document.write('<layer name="nsDate'+i+'" top=0 left=0 height='+a+' width='+a+'><center>'+props2+D[i]+'</font></center></layer>'); 056 for (i=0; i < n; i++) 057 document.write('<layer name="nsFace'+i+'" top=0 left=0 height='+a+' width='+a+'><center>'+props+Face[i]+'</font></center></layer>'); 058 for (i=0; i < S.length; i++) 059 document.write('<layer name=nsSeconds'+i+' top=0 left=0 width=15 height=15><font face=Arial size=3 color='+sCol+'><center><b>'+S[i]+'</b></center></font></layer>'); 060 for (i=0; i < M.length; i++) 061 document.write('<layer name=nsMinutes'+i+' top=0 left=0 width=15 height=15><font face=Arial size=3 color='+mCol+'><center><b>'+M[i]+'</b></center></font></layer>'); 062 for (i=0; i < H.length; i++) 063 document.write('<layer name=nsHours'+i+' top=0 left=0 width=15 height=15><font face=Arial size=3 color='+hCol+'><center><b>'+H[i]+'</b></center></font></layer>'); 064 } 065 if (ie){ 066 document.write('<div id="Od"><div>'); 067 for (i=0; i < D.length; i++) 068 document.write('<div id="ieDate">'+props2+D[i]+'</B></font></div>'); 069 document.write('</div></div>'); 070 document.write('<div id="Of"><div>'); 071 for (i=0; i < n; i++) 072 document.write('<div id="ieFace">'+props+Face[i]+'</B></font></div>'); 073 document.write('</div></div>'); 074 document.write('<div id="Oh"><div>'); 075 for (i=0; i < H.length; i++) 076 document.write('<div id="ieHours">'+H[i]+'</div>'); 077 document.write('</div></div>'); 078 document.write('<div id="Om"><div>'); 079 for (i=0; i < M.length; i++) 080 document.write('<div id="ieMinutes">'+M[i]+'</div>'); 081 document.write('</div></div>') 082 document.write('<div id="Os"><div>'); 083 for (i=0; i < S.length; i++) 084 document.write('<div id="ieSeconds">'+S[i]+'</div>'); 085 document.write('</div></div>') 086 } 087 (ns)?window.captureEvents(Event.MOUSEMOVE):0; 088 function Mouse(evnt){ 089 ymouse = (ns)?evnt.pageY+ClockFromMouseY-(window.pageYOffset):event.y+ClockFromMouseY; 090 xmouse = (ns)?evnt.pageX+ClockFromMouseX:event.x+ClockFromMouseX; 091 } 092 (ns)?window.onMouseMove=Mouse:document.onmousemove=Mouse; 093 function ClockAndAssign(){ 094 time = new Date (); 095 secs = time.getSeconds(); 096 sec = -1.57 + Math.PI * secs/30; 097 mins = time.getMinutes(); 098 min = -1.57 + Math.PI * mins/30; 099 hr = time.getHours(); 100 hrs = -1.575 + Math.PI * hr/6+Math.PI*parseInt(time.getMinutes())/360; 101 if (ie){ 102 Od.style.top=window.document.body.scrollTop; 103 Of.style.top=window.document.body.scrollTop; 104 Oh.style.top=window.document.body.scrollTop; 105 Om.style.top=window.document.body.scrollTop; 106 Os.style.top=window.document.body.scrollTop; 107 } 108 for (i=0; i < n; i++){ 109 var F=(ns)?document.layers['nsFace'+i]:ieFace[i].style; 110 F.top=y[i] + ClockHeight*Math.sin(-1.0471 + i*Split*Math.PI/180)+scrll; 111 F.left=x[i] + ClockWidth*Math.cos(-1.0471 + i*Split*Math.PI/180); 112 } 113 for (i=0; i < H.length; i++){ 114 var HL=(ns)?document.layers['nsHours'+i]:ieHours[i].style; 115 HL.top=y[i]+HandY+(i*HandHeight)*Math.sin(hrs)+scrll; 116 HL.left=x[i]+HandX+(i*HandWidth)*Math.cos(hrs); 117 } 118 for (i=0; i < M.length; i++){ 119 var ML=(ns)?document.layers['nsMinutes'+i]:ieMinutes[i].style; 120 ML.top=y[i]+HandY+(i*HandHeight)*Math.sin(min)+scrll; 121 ML.left=x[i]+HandX+(i*HandWidth)*Math.cos(min); 122 } 123 for (i=0; i < S.length; i++){ 124 var SL=(ns)?document.layers['nsSeconds'+i]:ieSeconds[i].style; 125 SL.top=y[i]+HandY+(i*HandHeight)*Math.sin(sec)+scrll; 126 SL.left=x[i]+HandX+(i*HandWidth)*Math.cos(sec); 127 } 128 for (i=0; i < D.length; i++){ 129 var DL=(ns)?document.layers['nsDate'+i]:ieDate[i].style; 130 DL.top=Dy[i] + ClockHeight*1.5*Math.sin(currStep+i*Dsplit*Math.PI/180)+scrll; 131 DL.left=Dx[i] + ClockWidth*1.5*Math.cos(currStep+i*Dsplit*Math.PI/180); 132 } 133 currStep-=step; 134 } 135 function Delay(){ 136 scrll=(ns)?window.pageYOffset:0; 137 Dy[0]=Math.round(DY[0]+=((ymouse)-DY[0])*speed); 138 Dx[0]=Math.round(DX[0]+=((xmouse)-DX[0])*speed); 139 for (i=1; i < D.length; i++){ 140 Dy[i]=Math.round(DY[i]+=(Dy[i-1]-DY[i])*speed); 141 Dx[i]=Math.round(DX[i]+=(Dx[i-1]-DX[i])*speed); 142 } 143 y[0]=Math.round(Y[0]+=((ymouse)-Y[0])*speed); 144 x[0]=Math.round(X[0]+=((xmouse)-X[0])*speed); 145 for (i=1; i < n; i++){ 146 y[i]=Math.round(Y[i]+=(y[i-1]-Y[i])*speed); 147 x[i]=Math.round(X[i]+=(x[i-1]-X[i])*speed); 148 } 149 ClockAndAssign(); 150 setTimeout('Delay()',40); 151 } 152 if (ns||ie)window.onload=Delay; 153 // --></SCRIPT> |
随便看 |
|
在线学习网范文大全提供好词好句、学习总结、工作总结、演讲稿等写作素材及范文模板,是学习及工作的有利工具。