更新時(shí)間：2010-12-19
我們經(jīng)常會(huì)在頁(yè)面中添加一些JavaScript代碼用來(lái)顯示時(shí)間。但是有時(shí)加入一些代碼可能會(huì)影響頁(yè)面的布局�，F(xiàn)在給你一段代碼，它將給你生成一個(gè)跳動(dòng)的時(shí)鐘，而且時(shí)鐘是疊加在背景上的，再也不用擔(dān)心布局上的問(wèn)題了。
一、把下面的代碼加到<head></head>區(qū)域中:
<script language=JavaScript>
<!--//
function clockon() {
thistime= new Date()
var hours=thistime.getHours()
var minutes=thistime.getMinutes()
var seconds=thistime.getSeconds()
if (eval(hours) <10) {hours="0"+hours}
if (eval(minutes) < 10) {minutes="0"+minutes}
if (seconds < 10) {seconds="0"+seconds}
thistime = hours+":"+minutes+":"+seconds
if(document.all) {
bgclocknoshade.innerHTML=thistime
bgclockshade.innerHTML=thistime
}
if(document.layers) {
document.bgclockshade.document.write('<div id="bgclockshade" style="position:absolute;visibility:visible;font-family:Verdana;color:FFAAAAA;font-size:120px;top:10px;left:152px">'+thistime+'</div>')
document.bgclocknoshade.document.write('<div id="bgclocknoshade" style="position:absolute;visibility:visible;font-family:Verdana;color:DDDDDD;font-size:120px;top:10px;left:150px">'+thistime+'</div>')
document.close()
}
var timer=setTimeout("clockon()"，200)
}
//-->
</script>
二、在<body></body>直接加入如下代碼：
<div id="bgclockshade" style="position:absolute;visibility:visible;font-family:Arial;color:FF8888;font-size:120px;top:102px;left:152px">
</div>
<BR><BR>
<div id="bgclocknoshade" style="position:absolute;visibility:visible;font-family:Arial;color:DDDDDD;font-size:120px;top:100px;left:150px">
</div><BR><BR>
<BR><div id="mainbody" style="position:absolute; visibility:visible"><BR>
</div><BR>
注："font-size:120px"是用來(lái)設(shè)置字體的大小，color:FF8888是用來(lái)設(shè)置字體顏色的。
三、最后把<body>中內(nèi)容改為：
<body bgcolor="#ffffff" onLoad="clockon()">
注：<body bgcolor="#ffffff" onLoad="clockon()">中的"#ffffff" 是網(wǎng)頁(yè)的背景顏色代碼，可以自行修改。
提醒：該效果所顯示的時(shí)鐘是利用層來(lái)定位的，所以你可在Dreamweaver中移動(dòng)時(shí)鐘的位置；另外，時(shí)鐘具有陰影效果，這些都是可以自行修改的。如果大家有什么疑問(wèn)可以跟我們交流。
