» 网友学堂 » Javascript教程 » 酷的倒影时钟
酷的倒影时钟
作者：ljjk5 发表时间：2007-4-7 01:15 阅读：410次 在百度搜索相关内容
特酷的倒影时钟


下面为效果显示区!
15:49:0215:49:02




脚本说明:
第一步:把如下代码加入<head>区域中
<head>
<style>
.time { font-size: 12pt; line-height: 14pt; color:red;}
</style>
<SCRIPT language=JavaScript>
<!-- Hiding
var ctimer;

function init(){
if (document.all){
tim2.style.left=tim1.style.posLeft;
tim2.style.top=tim1.style.posTop+tim1.offsetHeight-6;
settimes();
}
}

function settimes(){
var time= new Date();
hours= time.getHours();
mins= time.getMinutes();
secs= time.getSeconds();
if (hours<10)
hours="0"+hours;
if(mins<10)
mins="0"+mins;
if (secs<10)
secs="0"+secs;
tim1.innerHTML=hours+":"+mins+":"+secs
tim2.innerHTML=hours+":"+mins+":"+secs
ctimer=setTimeout('settimes()',960);
}
// Done hiding -->
</SCRIPT>


第二步:把如下代码加入<body>区域中
<DIV class=time id=tim1
style="HEIGHT: 20px; LEFT: 50px; POSITION: absolute; TOP: 10px; WIDTH: 10px"></DIV>
<DIV class=time id=tim2
style="FILTER: flipv() alpha(opacity=20); FONT-STYLE: italic; POSITION: absolute"></DIV>

第三步:把<body>改为
<body bgcolor="#fef4d9" onload="init()">