站内搜索: 请输入搜索关键词

当前页面: 开发资料首页Javascript 专题纯JavaScript时钟

纯JavaScript时钟

摘要: 纯JavaScript时钟
<textarea readonly style="border:none;font-family:Courier New;line-height:150%;width:760px;overflow-y:visible">

脚本说明:
第一步:把如下代码加入<head>区域中:
<script language=javascript>

function runClock() {
for (i=0; i<13; i++) {
obs[i][0].left=obs[i][1]+pX
obs[i][0].top=obs[i][2]+pY
}
}

var lastsec
function timer() {
time = new Date ()
sec = time.getSeconds()
if (sec!=lastsec) {

lastsec = sec
sec=Math.PI*sec/30
min=Math.PI*time.getMinutes()/30
hr =Math.PI*((time.getHours()*60)+time.getMinutes())/360
for (i=1;i<6;i++) {
obs[i][1] = Math.sin(sec) * (44 - (i-1)*11)-16;
if (document.layers)obs[i][1]+=10;
obs[i][2] = -Math.cos(sec) * (44 - (i-1)*11)-27;
}
for (i=6;i<10;i++) {
obs[i][1] = Math.sin(min) * (40 - (i-6)*10)-16;
if (document.layers)obs[i][1]+=10;
obs[i][2] = -Math.cos(min) * (40 - (i-6)*10)-27;
}
for (i=10;i<13;i++) {
obs[i][1] = Math.sin(hr) * (37 - (i-10)*11)-16;
if (document.layers)obs[i][1]+=10;
obs[i][2] = -Math.cos(hr) * (37 - (i-10)*11)-27;
}
}

}
function setNum(){

cl (0,-67,-65);
cl (1,10,-51);
cl (2,28,-33);
cl (3,35,-8);
cl (4,28,17);
cl (5,10,35);
cl (6,-15,42);
cl (7,-40,35);
cl (8,-58,17);
cl (9,-65,-8);
cl (10,-58,-33);
cl (11,-40,-51);
cl (12,-16,-56);

}

file://


</script>


第二步:把<body>中加入如下代码:



1

2

3

4

5

6

7

8

9

10

11

12


.

.

.

.

.

.

.

.

.

.

.

.


第三步:把<body>中内容改为:
<body bgcolor="#fef4d9" onLoad="ob(),setNum(),setInterval('timer()',100);setInterval('runClock()',100)">


</textarea>
↑返回目录
前一篇: PHP+Javascript液晶时钟
后一篇: 在Javascript中为String对象添加trim,ltrim,rtrim方法