Javascript脚本特效示例：[34]全日制时钟

时间：2024-10-17 03:14:02

1、在桌机上新建文本文档，命名为晓博JavaScript特效测试.txt，在文本文档里中入HTML文档的基本元素如下，并保存。<html><head><title媪青怍牙>晓博JavaScript特效测试</title></head><body><div id="zy"> <div id="login"></div> <div id="daohang"> <ul> <li><a href="index.html">首页</a></li> <li><a href="jianjie.html">七夕简介</a></li> <li><a href="#">七夕节传说</a></li> <li><a href="#">七夕节习俗</a></li> <li><a href="#">诗词& 歌谣</a></li> <li><a href="#">七夕节寄语</a></li> </ul> </div></div></body></html>

2、第一步:把如下代码加入<body>区域中<script language屏顿幂垂="JavaScript">熠硒勘唏function showMilitaryTime(){ if (document.form.showMilitary[0].checked) { return true; } return false;}function showTheHours(theHour){ if (showMilitaryTime() || (theHour > 0 && theHour < 13)) { if (theHour == "0") theHour = 12; return (theHour); } if (theHour == 0) { return (12); } return (theHour-12);}function showZeroFilled(inValue){ if (inValue > 9) { return "" + inValue; } return "0" + inValue;}function showAmPm(){ if (showMilitaryTime()) { return (""); } if (now.getHours() < 12) { return (" am"); } return (" pm");}function showTheTime(){ now = new Date document.form.showTime.value = showTheHours(now.getHours()) + ":" + showZeroFilled(now.getMinutes()) + ":" + showZeroFilled(now.getSeconds()) + showAmPm() setTimeout("showTheTime()",1000)}</script><FORM name=form><INPUT name=showTime size=11><P><INPUT CHECKED name=showMilitary type=radio>Military Time<BR><INPUTname=showMilitary type=radio Unchecked> 12 Hour Time </FORM>

3、第二步:把<body>中的内容改了,并重名文档为HTML文件<body bgcolor="#fef4d9" onload=showTheTime()>

4、用IE浏览器打开晓博JavaScript特效测试.html文件，可以看到全日制时钟特效,如下图