代码如下:
<html xmlns="http://www.w3.org/1999/xhtml"><head><script language="javascript" type="text/javascript">function $(){var elements=new Array();for(var i=0;i<arguments.length;i++){var element=arguments[i];if(typeof element=="string")element=document.getElementById(element);if(arguments.length==1)return element;elements.push(element);}return elements;}Clock = function(element){this.element = element;if($(element)==null){var element=document.createElement("div");document.body.appendChild(element);element.id=this.element;}for(i=1;i<=12;i++){$(element).innerHTML += "<div id=\"c"+i+"\" style=\"width:20px;height:20px;position:absolute;z-index:5;font-size:11px;\"><b>"+i+"</b></div>";pAngle = this.GetAngle(i,12);pP = this.GetXY(this.W,pAngle);$("c"+i).style.top = pP[1]+this.Y-this.ClockOffsetY+"px";$("c"+i).style.left = pP[0]+this.X-this.ClockOffsetX+"px";}};Clock.prototype = {ClockOffsetX:5,/*时钟微调*/ClockOffsetY:7,X:950,/*时钟位置(时钟中心为原点)*/Y:60,W:40,/*时钟宽度/2*/density:10,/*指针密度*/PoinerOffsetX:0,/*指针微调*/PoinerOffsety:12,GetAngle:function(num1,num2){return Math.PI*num1/num2*2;},GetXY:function(w,angle){var p = new Array();p[0] = w*Math.sin(angle);p[1] = -w*Math.cos(angle);return p;},SetClock:function(){for(i=1;i<=this.density;i++){$(this.element).innerHTML += "<div id=\"second"+i+"\" style=\"color:#000000;text-align:center;font-size:12px;position:absolute;z-index:8\"> <b>.</b></div>";$(this.element).innerHTML += "<div id=\"minute"+i+"\" style=\"color:#00fff0;text-align:center;font-size:12px;position:absolute;z-index:7\"> <b>.</b></div>";$(this.element).innerHTML += "<div id=\"hour"+i+"\" style=\"color:#fff000;text-align:center;font-size:12px;position:absolute;z-index:6\"> <b>.</b></div>";}},Run:function(){var now = new Date();var hour=now.getHours();var minute=now.getMinutes();var second=now.getSeconds();var self = this; var pAngle; var pP;for(i=1;i<=this.density;i++){pAngle = this.GetAngle(second,60);pP = this.GetXY((i-1)*(this.W/this.density)/1.3,pAngle);$("second"+i).style.top = pP[1]+this.Y-this.PoinerOffsety+"px";$("second"+i).style.left = pP[0]+this.X-this.PoinerOffsetX+"px";pAngle = this.GetAngle(minute,60);pP = this.GetXY((i-1)*(this.W/this.density)/1.5,pAngle);$("minute"+i).style.top = pP[1]+this.Y-this.PoinerOffsety+"px";$("minute"+i).style.left = pP[0]+this.X-this.PoinerOffsetX+"px";pAngle = this.GetAngle(((hour>12)?(hour-12):hour)*60+minute,12*60);pP = this.GetXY((i-1)*(this.W/this.density)/1.9,pAngle);$("hour"+i).style.top = pP[1]+this.Y-this.PoinerOffsety+"px";$("hour"+i).style.left = pP[0]+this.X-this.PoinerOffsetX+"px";}setTimeout(function(){self.Run()},1000);}}</script></head><body><script language="javascript" type="text/javascript"> var setclock= new Clock("SetClock"); setclock.SetClock(); setclock.Run();</script></body></html> [Ctrl+A 全部选择进行拷贝 提示:可先修改部分代码,再点击运行]
E-file:蓝色理想 蓝色理想的最新文章:C# 中的委托和事件网页制作,改变你的思维方式重新认识 button 标签 银光的光.划破天际——微软SilverlightPowerShadow 影子系统试用手记flash9.ocx 加载错误解决方法 推荐一些实用的Firefox扩展 做网站的一些定律 如何生成XML数据 [2]如何生成XML数据 (1)病毒漏报与误报 用服务器的站长常犯的错误 文件夹删除不掉怎么办?关于系统安全的心得 关于诺顿误删系统文件的解决方法整数分区的计算 CSS Hack汇总快查 网页中各度量单位的比较 用javascript 转换外部链接样式 蓝色理想作品库上线请尊重用户的需求非设计师谈设计之Apple改版输入表单的三种布局利用日志维护TAG 有关AS3编程的一些总结fireworks 制作倾慕系列图标Flash CS3 组件开发教程一个js的时钟可用性测试开始前需要掌握的八个CSS布局技巧