js实现的跟随鼠标移动的时钟效果(中英文日期显示)

中文日期限制
</p> <p><!--<br /> dcol='red'; //定义日历颜色<br /> fcol='#ff0000'; //定义1-12这12个数的颜色<br /> scol='#00ff00'; //定义秒针颜色<br /> mcol='#0000ff'; //定义分针颜色<br /> hcol='#ff0000'; //定义时针颜色<br /> clockheight=40; //定义<a href="https://kunjuke.com/tag/1239/" title="时钟" target="_blank">时钟</a>的高度<br /> clockwidth=40; //定义时钟的宽度<br /> clockfrommousey=0; //定义时钟的中心距<a href="https://kunjuke.com/tag/286/" title="鼠标" target="_blank">鼠标</a>的相对垂直距离<br /> clockfrommousex=100; //定义时钟中心距鼠标的相对水平距离<br /> //以上颜色值你要据你页面的背景颜色进行修改！注意不要你页面的背景色一致哦。<br /> d=new array("星期日","星期一","星期二","星期三","星期四","星期五","星期六");<br /> m=new array("一月","二月","三月","四月","五月","六月","七月","八月","九月","十月","十一月","十二月"); //以上是给定星期和月份的取值范围<br /> date=new date();<br /> day=date.getdate(); //取得当前日期命令<br /> year=date.getyear(); //取得当前年份命令<br /> if (year < 2000) year=year+1900;<br /> todaysdate="年 "+m[date.getmonth()]+" "+day+"日 "+d[date.getday()]+" "+year;<br /> d=todaysdate.split(''); //显示"某年某月某日"<br /> h='...';<br /> h=h.split('');<br /> m='....';<br /> m=m.split('');<br /> s='.....';<br /> s=s.split(''); //使秒、分、时针反向相应的位置<br /> face='1 2 3 4 5 6 7 8 9 10 11 12';<br /> font='arial';<br /> size=1; //定义秒、分、时针及1-12等字符的宋体、大小（最好匆改动哦）<br /> speed=0.8; //定义一旦鼠标位置发生变化时所有相关字符<a href="https://kunjuke.com/tag/1797/" title="跟随" target="_blank">跟随</a>至前面指定的鼠标的相对位置的速度，能看到各字符的轨迹，值可在0.1-1.0之间改动（值最小为0.1时跟随过来的速度最慢，值为1.0时跟随速度最快且与轨迹显示）<br /> ns=(document.layers);<br /> ie=(document.all); //说明在ns和ie两种不同浏览器里都适用 </p> <p>//以下的大段语句定义了ns和ie浏览器各自如何控制并完成时间和旋转的日历跟随鼠标转的<br /> face=face.split(' ');<br /> n=face.length;<br /> a=size*10;<br /> ymouse=0;<br /> xmouse=0;<br /> scrll=0;<br /> props="<font face="+font+" size="+size+" color="+fcol+">";<br /> props2="<font face="+font+" size="+size+" color="+dcol+">";<br /> split=360/n;<br /> dsplit=360/d.length;<br /> handheight=clockheight/4.5<br /> handwidth=clockwidth/4.5<br /> handy=-7;<br /> handx=-2.5;<br /> scrll=0;<br /> step=0.06;<br /> currstep=0;<br /> y=new array();x=new array();y=new array();x=new array();<br /> for (i=0; i < n; i++){y[i]=0;x[i]=0;y[i]=0;x[i]=0}<br /> dy=new array();dx=new array();dy=new array();dx=new array();<br /> for (i=0; i < d.length; i++){dy[i]=0;dx[i]=0;dy[i]=0;dx[i]=0} </p> <p>if (ns){<br /> for (i=0; i < d.length; i++)<br /> document.write(''+props2+d[i]+'</font>');<br /> for (i=0; i < n; i++)<br /> document.write(''+props+face[i]+'</font>');<br /> for (i=0; i < s.length; i++)<br /> document.write('<font face="arial" size="3" color='+scol+'><b>'+s[i]+'</b></font>');<br /> for (i=0; i < m.length; i++)<br /> document.write('<font face="arial" size="3" color='+mcol+'><b>'+m[i]+'</b></font>');<br /> for (i=0; i < h.length; i++)<br /> document.write('<font face="arial" size="3" color='+hcol+'><b>'+h[i]+'</b></font>');<br /> } </p> <p>if (ie){<br /> document.write('');<br /> for (i=0; i < d.length; i++)<br /> document.write(''+props2+d[i]+'</font>');<br /> document.write('');<br /> document.write('');<br /> for (i=0; i < n; i++)<br /> document.write(''+props+face[i]+'</font>');<br /> document.write('');<br /> document.write('');<br /> for (i=0; i < h.length; i++)<br /> document.write(''+h[i]+'');<br /> document.write('');<br /> document.write('');<br /> for (i=0; i < m.length; i++)<br /> document.write(''+m[i]+'');<br /> document.write('')<br /> document.write('');<br /> for (i=0; i < s.length; i++)<br /> document.write(''+s[i]+'');<br /> document.write('')<br /> } </p> <p>(ns)?window.captureevents(event.mousemove):0;<br /> function mouse(evnt){<br /> ymouse = (ns)?evnt.pagey+clockfrommousey-(window.pageyoffset):<br /> event.y+clockfrommousey;<br /> xmouse = (ns)?evnt.pagex+clockfrommousex:event.x+clockfrommousex;<br /> }<br /> (ns)?window.onmousemove=mouse:document.onmousemove=mouse; </p> <p>function clockandassign(){<br /> time = new date ();<br /> secs = time.getseconds();<br /> sec = -1.57 + math.pi * secs/30;<br /> mins = time.getminutes();<br /> min = -1.57 + math.pi * mins/30;<br /> hr = time.gethours();<br /> hrs = -1.575 + math.pi * hr/6+math.pi*parseint(time.getminutes())/360;<br /> if (ie){<br /> od.style.top=window.document.body.scrolltop;<br /> of.style.top=window.document.body.scrolltop;<br /> oh.style.top=window.document.body.scrolltop;<br /> om.style.top=window.document.body.scrolltop;<br /> os.style.top=window.document.body.scrolltop;<br /> }<br /> for (i=0; i < n; i++){<br /> var f=(ns)?document.layers['nsface'+i]:ieface[i].style;<br /> f.top=y[i] + clockheight*math.sin(-1.0471 + i*split*math.pi/180)+scrll;<br /> f.left=x[i] + clockwidth*math.cos(-1.0471 + i*split*math.pi/180);<br /> }<br /> for (i=0; i < h.length; i++){<br /> var hl=(ns)?document.layers['nshours'+i]:iehours[i].style;<br /> hl.top=y[i]+handy+(i*handheight)*math.sin(hrs)+scrll;<br /> hl.left=x[i]+handx+(i*handwidth)*math.cos(hrs);<br /> }<br /> for (i=0; i < m.length; i++){<br /> var ml=(ns)?document.layers['nsminutes'+i]:ieminutes[i].style;<br /> ml.top=y[i]+handy+(i*handheight)*math.sin(min)+scrll;<br /> ml.left=x[i]+handx+(i*handwidth)*math.cos(min);<br /> }<br /> for (i=0; i < s.length; i++){<br /> var sl=(ns)?document.layers['nsseconds'+i]:ieseconds[i].style;<br /> sl.top=y[i]+handy+(i*handheight)*math.sin(sec)+scrll;<br /> sl.left=x[i]+handx+(i*handwidth)*math.cos(sec);<br /> }<br /> for (i=0; i < d.length; i++){<br /> var dl=(ns)?document.layers['nsdate'+i]:iedate[i].style;<br /> dl.top=dy[i] + clockheight*1.5*math.sin(currstep+i*dsplit*math.pi/180)+scrll;<br /> dl.left=dx[i] + clockwidth*1.5*math.cos(currstep+i*dsplit*math.pi/180);<br /> }<br /> currstep-=step;<br /> }<br /> function delay(){<br /> scrll=(ns)?window.pageyoffset:0;<br /> dy[0]=math.round(dy[0]+=((ymouse)-dy[0])*speed);<br /> dx[0]=math.round(dx[0]+=((xmouse)-dx[0])*speed);<br /> for (i=1; i < d.length; i++){<br /> dy[i]=math.round(dy[i]+=(dy[i-1]-dy[i])*speed);<br /> dx[i]=math.round(dx[i]+=(dx[i-1]-dx[i])*speed);<br /> }<br /> y[0]=math.round(y[0]+=((ymouse)-y[0])*speed);<br /> x[0]=math.round(x[0]+=((xmouse)-x[0])*speed);<br /> for (i=1; i </p> <p>
[ctrl+a 全选 注:如需引入外部js需刷新才能执行]
英文日期显示:
<br /> dcol='000099';//date colour.<br /> fcol='668099';//face colour.<br /> scol='ff0000';//seconds colour.<br /> mcol='000000';//minutes colour.<br /> hcol='000000';//hours colour.<br /> clockheight=40;<br /> clockwidth=40;<br /> clockfrommousey=0;<br /> clockfrommousex=100;<br /> //alter nothing below! alignments will be lost!<br /> d=new array("sunday","monday","tuesday","wednesday","thursday","friday","saturday");<br /> m=new array("january","february","march","april","may","june","july","august","september","october","november","december");<br /> date=new date();<br /> day=date.getdate();<br /> year=date.getyear();<br /> if (year < 2000) year=year+1900;<br /> todaysdate=" "+d[date.getday()]+" "+day+" "+m[date.getmonth()]+" "+year;<br /> d=todaysdate.split('');<br /> h='...';<br /> h=h.split('');<br /> m='....';<br /> m=m.split('');<br /> s='.....';<br /> s=s.split('');<br /> face='1 2 3 4 5 6 7 8 9 10 11 12';<br /> //font='arial';<br /> font='verdana';<br /> size=1;<br /> speed=0.6;<br /> ns=(document.layers);<br /> ie=(document.all);<br /> face=face.split(' ');<br /> n=face.length;<br /> a=size*10;<br /> ymouse=0;<br /> xmouse=0;<br /> scrll=0;<br /> props="<font face="+font+" size="+size+" color="+fcol+"><b>";<br /> props2="<font face="+font+" size="+size+" color="+dcol+"><b>";<br /> split=360/n;<br /> dsplit=360/d.length;<br /> handheight=clockheight/4.5<br /> handwidth=clockwidth/4.5<br /> handy=-7;<br /> handx=-2.5;<br /> scrll=0;<br /> step=0.06;<br /> currstep=0;<br /> y=new array();x=new array();y=new array();x=new array();<br /> for (i=0; i < n; i++){y[i]=0;x[i]=0;y[i]=0;x[i]=0}<br /> dy=new array();dx=new array();dy=new array();dx=new array();<br /> for (i=0; i < d.length; i++){dy[i]=0;dx[i]=0;dy[i]=0;dx[i]=0}<br /> if (ns){<br /> for (i=0; i < d.length; i++)<br /> document.write(''+props2+d[i]+'</font>');<br /> for (i=0; i < n; i++)<br /> document.write(''+props+face[i]+'</font>');<br /> for (i=0; i < s.length; i++)<br /> document.write('<font face="arial" size="3" color='+scol+'><b>'+s[i]+'</b></font>');<br /> for (i=0; i < m.length; i++)<br /> document.write('<font face="arial" size="3" color='+mcol+'><b>'+m[i]+'</b></font>');<br /> for (i=0; i < h.length; i++)<br /> document.write('<font face="arial" size="3" color='+hcol+'><b>'+h[i]+'</b></font>');<br /> }<br /> if (ie){<br /> document.write('');<br /> for (i=0; i < d.length; i++)<br /> document.write(''+props2+d[i]+'</b></font>');<br /> document.write('');<br /> document.write('');<br /> for (i=0; i < n; i++)<br /> document.write(''+props+face[i]+'</b></font>');<br /> document.write('');<br /> document.write('');<br /> for (i=0; i < h.length; i++)<br /> document.write(''+h[i]+'');<br /> document.write('');<br /> document.write('');<br /> for (i=0; i < m.length; i++)<br /> document.write(''+m[i]+'');<br /> document.write('')<br /> document.write('');<br /> for (i=0; i < s.length; i++)<br /> document.write(''+s[i]+'');<br /> document.write('')<br /> }<br /> (ns)?window.captureevents(event.mousemove):0;<br /> function mouse(evnt){<br /> ymouse = (ns)?evnt.pagey+clockfrommousey-(window.pageyoffset):event.y+clockfrommousey;<br /> xmouse = (ns)?evnt.pagex+clockfrommousex:event.x+clockfrommousex;<br /> }<br /> (ns)?window.onmousemove=mouse:document.onmousemove=mouse;<br /> function clockandassign(){<br /> time = new date ();<br /> secs = time.getseconds();<br /> sec = -1.57 + math.pi * secs/30;<br /> mins = time.getminutes();<br /> min = -1.57 + math.pi * mins/30;<br /> hr = time.gethours();<br /> hrs = -1.575 + math.pi * hr/6+math.pi*parseint(time.getminutes())/360;<br /> if (ie){<br /> od.style.top=window.document.body.scrolltop;<br /> of.style.top=window.document.body.scrolltop;<br /> oh.style.top=window.document.body.scrolltop;<br /> om.style.top=window.document.body.scrolltop;<br /> os.style.top=window.document.body.scrolltop;<br /> }<br /> for (i=0; i < n; i++){<br /> var f=(ns)?document.layers['nsface'+i]:ieface[i].style;<br /> f.top=y[i] + clockheight*math.sin(-1.0471 + i*split*math.pi/180)+scrll;<br /> f.left=x[i] + clockwidth*math.cos(-1.0471 + i*split*math.pi/180);<br /> }<br /> for (i=0; i < h.length; i++){<br /> var hl=(ns)?document.layers['nshours'+i]:iehours[i].style;<br /> hl.top=y[i]+handy+(i*handheight)*math.sin(hrs)+scrll;<br /> hl.left=x[i]+handx+(i*handwidth)*math.cos(hrs);<br /> }<br /> for (i=0; i < m.length; i++){<br /> var ml=(ns)?document.layers['nsminutes'+i]:ieminutes[i].style;<br /> ml.top=y[i]+handy+(i*handheight)*math.sin(min)+scrll;<br /> ml.left=x[i]+handx+(i*handwidth)*math.cos(min);<br /> }<br /> for (i=0; i < s.length; i++){<br /> var sl=(ns)?document.layers['nsseconds'+i]:ieseconds[i].style;<br /> sl.top=y[i]+handy+(i*handheight)*math.sin(sec)+scrll;<br /> sl.left=x[i]+handx+(i*handwidth)*math.cos(sec);<br /> }<br /> for (i=0; i < d.length; i++){<br /> var dl=(ns)?document.layers['nsdate'+i]:iedate[i].style;<br /> dl.top=dy[i] + clockheight*1.5*math.sin(currstep+i*dsplit*math.pi/180)+scrll;<br /> dl.left=dx[i] + clockwidth*1.5*math.cos(currstep+i*dsplit*math.pi/180);<br /> }<br /> currstep-=step;<br /> }<br /> function delay(){<br /> scrll=(ns)?window.pageyoffset:0;<br /> dy[0]=math.round(dy[0]+=((ymouse)-dy[0])*speed);<br /> dx[0]=math.round(dx[0]+=((xmouse)-dx[0])*speed);<br /> for (i=1; i < d.length; i++){<br /> dy[i]=math.round(dy[i]+=(dy[i-1]-dy[i])*speed);<br /> dx[i]=math.round(dx[i]+=(dx[i-1]-dx[i])*speed);<br /> }<br /> y[0]=math.round(y[0]+=((ymouse)-y[0])*speed);<br /> x[0]=math.round(x[0]+=((xmouse)-x[0])*speed);<br /> for (i=1; i < n; i++){<br /> y[i]=math.round(y[i]+=(y[i-1]-y[i])*speed);<br /> x[i]=math.round(x[i]+=(x[i-1]-x[i])*speed);<br /> }<br /> clockandassign();<br /> settimeout('delay()',10);<br /> }<br /> if (ns||ie)window.onload=delay; </p> <p>
[ctrl+a 全选 注:如需引入外部js需刷新才能执行]