Javascript脚本特效示例:[23]背景上加时钟

 时间:2026-02-14 15:19:26

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脚本特效示例:[23]背景上加时钟

Javascript脚本特效示例:[23]背景上加时钟

2、第一步:把如下代码加入<head>区域中:

<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>

3、第二步:把如下代码加入<body>区域中,并重名文档为HTML文件

<div id="bgclockshade" style="position:absolute;visibility:visible;font-family:Arial;color:FF8888;font-size:120px;top:102px;left:152px"></div>

<div id="bgclocknoshade" style="position:absolute;visibility:visible;font-family:Arial;color:DDDDDD;font-size:120px;top:100px;left:150px"></div>

<div id="mainbody" style="position:absolute; visibility:visible">

</div>

4、第三步:把<body>中内容改为:

<body bgcolor="#fef4d9" onLoad="clockon()">

5、用IE浏览器打开晓博JavaScript特效测试.html文件,可以看到时钟加在背景上特效如下图

Javascript脚本特效示例:[23]背景上加时钟

Javascript脚本特效示例:[23]背景上加时钟

  • Javascript脚本特效示例:[28]Form中的时钟
  • Javascript脚本特效示例:[31]倒影时钟
  • Javascript在网页中显示倒影时钟特效
  • 使用JavaScript创建一个时钟
  • 使用javascript实现页面上动态实时时钟
  • 热门搜索
    什么汤有营养 有什么好看的 什么是外汇储备 番茄红素的功效与作用 黑枸杞的作用与功效 什么是辩证唯物主义 羚羊角粉的功效与作用 足球知识 冒号的作用 文艺复兴运动