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>
![Javascript脚本特效示例：[25]时间交互提示](https://exp-picture.cdn.bcebos.com/38332303bbea3e86a9d149f75cd4483105eb552d.jpg)
![Javascript脚本特效示例：[25]时间交互提示](https://exp-picture.cdn.bcebos.com/49701aebf6a75f0f22b25c5a97324b18502c4c2d.jpg)
2、第一步：把如下代码加入<body>区域中,并重名文档为HTML文件<SCRIPT language="JavaScript"><!----------- var enabled = 0; today = new Date(); var day; var date; if(today.getDay()==0) day = "星期日" if(today.getDay()==1) day = "星期一" if(today.getDay()==2) day = "星期二" if(today.getDay()==3) day = "星期三" if(today.getDay()==4) day = "星期四" if(today.getDay()==5) day = "星期五" if(today.getDay()==6) day = "星期六" document.fgColor = " FF0072"; date1 = "<font size=2 color=red>" + (today.getYear()) + "年" + (today.getMonth() + 1 ) + "月" + today.getDate() + "日 " + "</font>"; date2 = "<font size=1 color=red>" + day + "</font>"; document.write("<center>" + date1.fontsize(3) + date2.fontsize(3) + "</center>"); //-----></SCRIPT><SCRIPT language="JavaScript"><!--document.write("<center><font color=#0066ff size=+1> ")day = new Date()hr = day.getHours()if (hr ==1)document.write("凌晨一点已过，别忘了休息喔！")if (hr ==2)document.write("该休息了，身体可是革命的本钱啊！")if (hr ==3)document.write("夜深人静，只有你敲击鼠标的声音...")if (hr ==4)document.write("四点过了，你明天不上班？？？")if (hr ==5)document.write("该去晨练了！！！")if (hr ==6)document.write("你知道吗，此时是国内网络速度最快的时候！")if (hr ==7)document.write("新的一天又开始了，祝你过得快乐！")if ((hr ==8) || (hr == 9) || (hr ==10))document.write("上午好！今天你看上去好精神哦！")if (hr ==11)document.write("十一点过了，快下班了吧？")if (hr ==12)document.write("十二点过了，还不下班？")if ((hr==13) || (hr==14))document.write("你不睡午觉？")if ((hr==15) || (hr==16) || (hr==17))document.write("下午好！")if ((hr==18) || (hr==19))document.write("吃晚饭了吧？")if ((hr==20) || (hr==21) || (hr==22))document.write("今晚又在这玩电脑了，没节目？")if (hr==23)document.write("真是越玩越精神，不打算睡了？")if (hr==0)document.write("凌晨了，还不睡？")document.write("</font></center>")//---></SCRIPT>
3、用IE浏览器打开晓博JavaScript特效测试.html文件，可以看到随时间变化提示特效，如下图
![Javascript脚本特效示例：[25]时间交互提示](https://exp-picture.cdn.bcebos.com/506d92f1d8a72633e01de557c02c56ee7a7f442d.jpg)
4、接着，改变代码把提示放到网页上角改document.write("<center>" + date1.fontsize(3) + date2.fontsize(3) + "</center>");为document.write("<div id=payrollHrInfo style='position:absolute;width:80;top:3;left:1000;visibility:visible;z-index: 1'><center>" + date1.fontsize(3) + date2.fontsize(3) + "</center></div>");改第二个<SCRIPT language="JavaScript">里的document.write("<center><font color=#0066ff size=+1> ")为document.write("<div id=payrollHrInfo style='position: absolute;width:180;top:38;left:1000;visibility:visible;z-index: 1'><font color=#0066ff size=+1> ")document.write("</font></center>")加上</div>结束标记，运行效果如下图
![Javascript脚本特效示例：[25]时间交互提示](https://exp-picture.cdn.bcebos.com/7a3e980e7c75e5f44c6cc6b9b1ceaad7736bbc2d.jpg)
5、把这段代码加入已经完成的网站，浏览运行效果，修改下相对位置 达到最好效果，第一个改变width:180;top:3;left:1080;第二个改变width:180;top:20;left:1100;如下图变化，浏览效果
![Javascript脚本特效示例：[25]时间交互提示](https://exp-picture.cdn.bcebos.com/64a62a0f6478142304205e8aaac2bbd6e0d0b22d.jpg)
![Javascript脚本特效示例：[25]时间交互提示](https://exp-picture.cdn.bcebos.com/6ca98461862541930d7198b0df1bd10ff326ab2d.jpg)
![Javascript脚本特效示例：[25]时间交互提示](https://exp-picture.cdn.bcebos.com/f367139a310e179922b3920cc9406afec214a32d.jpg)
