软件开发培训班 >> 编程开发 >> JavaScript

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

　　本文标签：鼠标移动,时钟

//以下的大段语句定义了NS和IE浏览器各自如何控制并完成时间和旋转的日历跟随鼠标转的 
Face=Face.split( ); 
n=Face.length; 
a=size*10; 
ymouse=0; 
xmouse=0; 
scrll=0; 
props="<font face="+font+" size="+size+" color="+fCol+">"; 
props2="<font face="+font+" size="+size+" color="+dCol+">"; 
Split=360/n; 
Dsplit=360/D.length; 
HandHeight=ClockHeight/4.5 
HandWidth=ClockWidth/4.5 
HandY=-7; 
HandX=-2.5; 
scrll=0; 
step=0.06; 
currStep=0; 
y=new Array();x=new Array();Y=new Array();X=new Array(); 
for (i=0; i < n; i++){y[i]=0;x[i]=0;Y[i]=0;X[i]=0} 
Dy=new Array();Dx=new Array();DY=new Array();DX=new Array(); 
for (i=0; i < D.length; i++){Dy[i]=0;Dx[i]=0;DY[i]=0;DX[i]=0}

if (ns){ 
for (i=0; i < D.length; i++) 
document.write(<layer name="nsDate+i+" top=0 left=0 height=+a+ width=+a+><center>+props2+D[i]+</font></center></layer>); 
for (i=0; i < n; i++) 
document.write(<layer name="nsFace+i+" top=0 left=0 height=+a+ width=+a+><center>+props+Face[i]+</font></center></layer>); 
for (i=0; i < S.length; i++) 
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>); 
for (i=0; i < M.length; i++) 
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>); 
for (i=0; i < H.length; i++) 
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>); 
}

if (ie){ 
document.write(<div id="Od" style="position:absolute;top:0px;left:0px"><div style="position:relative">); 
for (i=0; i < D.length; i++) 
document.write(<div id="ieDate" style="position:absolute;top:0px;left:0;height:+a+;width:+a+;text-align:center">+props2+D[i]+</font></div>); 
document.write(</div></div>); 
document.write(<div id="Of" style="position:absolute;top:0px;left:0px"><div style="position:relative">); 
for (i=0; i < n; i++) 
document.write(<div id="ieFace" style="position:absolute;top:0px;left:0;height:+a+;width:+a+;text-align:center">+props+Face[i]+</font></div>); 
document.write(</div></div>); 
document.write(<div id="Oh" style="position:absolute;top:0px;left:0px"><div style="position:relative">); 
for (i=0; i < H.length; i++) 
document.write(<div id="ieHours" style="position:absolute;width:16px; height:16px;font-family:Arial;font-size:16px;color:+hCol+;text-align:center;font-weight:bold">+H[i]+</div>); 
document.write(</div></div>); 
document.write(<div id="Om" style="position:absolute;top:0px;left:0px"><div style="position:relative">); 
for (i=0; i < M.length; i++) 
document.write(<div id="ieMinutes" style="position:absolute;width:16px; height:16px;font-family:Arial;font-size:16px;color:+mCol+;text-align:center;font-weight:bold">+M[i]+</div>); 
document.write(</div></div>) 
document.write(<div id="Os" style="position:absolute;top:0px;left:0px"><div style="position:relative">); 
for (i=0; i < S.length; i++) 
document.write(<div id="ieSeconds" style="position:absolute;width:16px; height:16px;font-family:Arial;font-size:16px;color:+sCol+;text-align:center;font-weight:bold">+S[i]+</div>); 
document.write(</div></div>) 
}

(ns)?window.captureEvents(Event.MOUSEMOVE):0; 
function Mouse(evnt){ 
ymouse = (ns)?evnt.pageY+ClockFromMouseY-(window.pageYOffset): 
event.y+ClockFromMouseY; 
xmouse = (ns)?evnt.pageX+ClockFromMouseX:event.x+ClockFromMouseX; 
} 
(ns)?window.onMouseMove=Mouse:document.onmousemove=Mouse;

技术文章快速查找

js读取本地excel文档数据的代码

初学js插入节点appendChild insertBefore使用方法

js 3种归并操作的实例代码

js列举css中所有图标的实现代码

自己动手制作jquery插件之自动添加删除行功能介绍

js控制当再次点击按钮时的间隔时间

jQuery EasyUI API 中文文档 DateTimeBox日期时间框

文本框根据输入内容自适应高度的代码

相关下载

在线教程导航

软件应用
·Windows8	·Windows7	·Word
·Excel	·PPT	·WPS
Web开发
·ASP	·JavaScript	·DIV+CSS
·JSP	·VbScript	·XML
·PHP
开发语言
·VB	·VC	·ASP.NET
·Java	·C++	·Delphi
数据库开发
·MySQL	·MsSQL	·Access
·Oracle	·DB2
手机系统
·Android	·iOS	·WindowsPhone
网站设计
·Flash	·Dreamweaver	·Fireworks
平面设计
·Photoshop	·CorelDraw	·AutoCAD
·3DsMAX	·Illustrator
网络技术
·网站运营	·网络安全	·网络搭建