|
网站首页
|
文章中心
|
电子书下载
|
矢量图库
|
视频教程
|
素材下载
|
程序代码下载
|
JS代码
|
论坛
|
教程
热门导航
:
QQ
FLASH
PHOTOSHOP
POCO
迅雷
MSN
ASP.NET
PHP
E话通
ACDSEE
pplive
卡巴斯基
瑞星杀毒
winrar
暴风影音
realplayer
优化大师
网际快车
变速齿轮
电子书
分类导航
:
网络编程
网站设计
图形动画
阅读工具
多媒体类
数据库类
服务器类
应用程序
操作系统
网络配置
常用软件
电脑硬件
视频
热门导航
:
VC
VB
PHOTOSHOP
autocad
delphi
asp
asp.net
php
flash
OFFICE
CORELDRAW
FIREWORKS
3DSMAX
您当前位置:您现在的位置:
龙腾软件教程网
>>
JS代码
>>
时间日期类
>> 代码正文
纯JavaScript时钟
作者:佚名 代码来源:网络 点击数: 更新时间:2006-11-4
1
2
3
4
5
6
7
8
9
10
11
12
.
.
.
.
.
.
.
.
.
.
.
.
纯JavaScript时钟
下面框中为脚本显示区
脚本说明: 第一步:把如下代码加入<head>区域中: <SCRIPT language=javascript> <!-- pX=400;pY=200 obs = new Array(13) function ob () { for (i=0; i<13; i++) { if (document.all) obs[i]=new Array (eval('ob'+i).style,-100,-100) else obs[i] = new Array (eval('document.ob'+i),-100,-100) } } function cl(a,b,c){ if (document.all) { if (a!=0) b+=-1 eval('c'+a+'.style.pixelTop='+(pY+(c))) eval('c'+a+'.style.pixelLeft='+(pX+(b))) } else{ if (a!=0) b+=10 eval('document.c'+a+'.top='+(pY+(c))) eval('document.c'+a+'.left='+(pX+(b))) } if (document.all) c0.style.pixelLeft=26 } 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); } //--> </SCRIPT> 第二步:把<body>中加入如下代码: <div id="c0" style="position:absolute;right:6;top:6; z-index:2;"> </div> <div id="c1" style="position:absolute;left:20;top:-20; z-index:5;font-size:11px;"><b>1</b></div> <div id="c2" style="position:absolute;left:20;top:-20; z-index:5;font-size:11px;"><b>2</b></div> <div id="c3" style="position:absolute;left:20;top:-20; z-index:5;font-size:11px;"><b>3</b></div> <div id="c4" style="position:absolute;left:20;top:-20; z-index:5;font-size:11px;"><b>4</b></div> <div id="c5" style="position:absolute;left:20;top:-20; z-index:5;font-size:11px;"><b>5</b></div> <div id="c6" style="position:absolute;left:20;top:-20; z-index:5;font-size:11px;"><b>6</b></div> <div id="c7" style="position:absolute;left:20;top:-20; z-index:5;font-size:11px;"><b>7</b></div> <div id="c8" style="position:absolute;left:20;top:-20; z-index:5;font-size:11px;"><b>8</b></div> <div id="c9" style="position:absolute;left:20;top:-20; z-index:5;font-size:11px;"><b>9</b></div> <div id="c10" style="position:absolute;left:20;top:-20; z-index:5;font-size:11px;"><b>10</b></div> <div id="c11" style="position:absolute;left:20;top:-20; z-index:5;font-size:11px;"><b>11</b></div> <div id="c12" style="position:absolute;left:20;top:-20; z-index:5;font-size:11px;"><b>12</b></div> <div id="ob0" style="position:absolute;left:-20;top:-20;z-index:1"> </div> <div id="ob1" style="position:absolute;left:-20;top:-20;z-index:8"> <font size="+3" color="#0000FF"><b>.</b></font></div> <div id="ob2" style="position:absolute;left:-20;top:-20;z-index:8"> <font size="+3" color="#0000FF"><b>.</b></font></div> <div id="ob3" style="position:absolute;left:-20;top:-20;z-index:8"> <font size="+3" color="#0000FF"><b>.</b></font></div> <div id="ob4" style="position:absolute;left:-20;top:-20;z-index:8"> <font size="+3" color="#0000FF"><b>.</b></font></div> <div id="ob5" style="position:absolute;left:-20;top:-20;z-index:8"> <font size="+3" color="#0000FF"><b>.</b></font></div> <div id="ob6" style="position:absolute;left:-20;top:-20;z-index:7"> <font size="+3" color="#00FFFF"><b>.</b></font></div> <div id="ob7" style="position:absolute;left:-20;top:-20;z-index:7"> <font size="+3" color="#00FFFF"><b>.</b></font></div> <div id="ob8" style="position:absolute;left:-20;top:-20;z-index:7"> <font size="+3" color="#00FFFF"><b>.</b></font></div> <div id="ob9" style="position:absolute;left:-20;top:-20;z-index:7"> <font size="+3" color="#00FFFF"><b>.</b></font></div> <div id="ob10" style="position:absolute;left:-20;top:-20;z-index:6"> <font size="+3" color="#F30000"><b>.</b></font></div> <div id="ob11" style="position:absolute;left:-20;top:-20;z-index:6"> <font size="+3" color="#F30000"><b>.</b></font></div> <div id="ob12" style="position:absolute;left:-20;top:-20;z-index:6"> <font size="+3" color="#F30000"><b>.</b></font></div> 第三步:把<body>中内容改为: <body bgcolor="#fef4d9" onLoad="ob(),setNum(),setInterval('timer()',100);setInterval('runClock()',100)">
上一个代码:
全中文日期显示特效
下一个代码:
距离某天时间
相关
代码
时钟加在背景上
显示特殊节日JS脚本
距离某天时间
全中文日期显示特效
js效果退出时显示访问时间
JS日历生成器
JS显示登陆时间效果代码
JS特效代码八种风格的时间日期
JS特效 倒计时代码生成器
JS特效时钟显示在任意指定位置
网友评论
最新教程
Photoshop制作爆炸的飞机
Excel 2007实现双面打印的两种另
PPStream精彩画面随心调整
3DSMAX制作星云动画
3DS MAX打造奇幻的宇宙空间
迅雷断点续传来修复破损光盘
Flash常用AS脚本语法详解
Photoshop制作图片透明棋盘特效
搜狗解密拼音输入法8大妙用
优化系统驱逐Windows系统流氓文件
推荐教程
了解VC++消息映射与命令通知
家庭局域网组建的三种方式
推荐视频
推荐电子书
热门教程
了解VC++消息映射与命令通知
家庭局域网组建的三种方式
{
设为首页
|
加入收藏
|
联系站长
|
友情链接
|
版权申明
版权所有2006-2008 龙腾教程网
联系方法:QQ 654611010 网站备案:浙