http://123.taobao.com/ 头部右边 有个 时间走动特效，自己网站 想用一下，可惜自己 水平有限 不能从 JS 文件中分离出 自己想要的代码， 希望大家给点帮助，万分感谢！！！
解决方案 »
- ext4.0中把Ext.tab.Panel放在Ext.container.Viewport只要在tab.Panel的items里加子控件就报错？
- 花钱请高手搭建myeclipse+tomcat+sqlserver2000
- 关于cookie的问题，其实跟技术没什么关系，但是挺烦人的
- 这几句jjs代码怎么不换行?
- 关闭div
- 我用VML做的一个时钟，就是文字标注、底色、边框修饰还搞不好，请大家看看！！
- 问题
- 一个关于在js里deleteRow的问题，100分相送！
- 请问让窗口最小化的事件是什么，谢谢！
- 浏览器关闭和刷新的判断
- jquery如何接收从php返回的json数据并使用？
- MAX_VALUE
<head>
<script type="text/javascript">
function startTime()
{
var today=new Date()
var h=today.getHours()
var m=today.getMinutes()
var s=today.getSeconds()
// add a zero in front of numbers<10
m=checkTime(m)
s=checkTime(s)
document.getElementById('txt').innerHTML=h+":"+m+":"+s
t=setTimeout('startTime()',500)
}function checkTime(i)
{
if (i<10)
{i="0" + i}
return i
}
</script>
</head><body onload="startTime()">
<div id="txt"></div>
</body>
</html>
<head>
<script language="javascript">
function startTime()
{
var today=new Date()
var h=today.getHours()
var m=today.getMinutes()
var s=today.getSeconds() document.getElementById('h1').src=""+Math.floor(h/10)+".png"
document.getElementById('h2').src=""+h%10+".png"
document.getElementById('m1').src=""+Math.floor(m/10)+".png"
document.getElementById('m2').src=""+m%10+".png"
document.getElementById('s1').src=""+Math.floor(s/10)+".png"
document.getElementById('s2').src=""+s%10+".png"
t=setTimeout('startTime()',1000)
} </script>
</head><body onload="startTime()">
<img id="h1" src="0.png"/>
<img id="h2" src="0.png"/>
<img src="a.png"/>
<img id="m1" src="0.png"/>
<img id="m2" src="0.png"/>
<img src="a.png"/>
<img id="s1" src="0.png"/>
<img id="s2" src="0.png"/>
</body>
</html>这个是我前几天自己做的时钟，跟你要的效果有相似之处，我的图片是找的比较卡通的数字，你要是想要你给的那个网页上那种效果可以自己找那种电子风格的数字，代码原理比较简单，就是用图片替换本来该显示数字的时钟，达到美观的效果。
<html>
<head>
<meta charset="gb2312"/>
<title>淘网址——我的上网主页，淘宝网旗下网址导航</title>
<link href="http://a.tbcdn.cn/p/tao123/1.0/fp/fp-pkg-min.css" rel="stylesheet"/>
<base target="_blank">
</head>
<body>
<div id="page">
<div id="header">
<div class="top">
<div class="time-box">
<div class="city">
<span id="J_timezone_city_wrap"><span id="J_timezone_city"></span></span>
<a href="#" class="grey" id="J_timezone" style="margin:0">更换时区</a>
<a href="#" id="J_clock" class="clock">[闹钟提醒]</a>
</div>
<div class="now clearfix">
<div id="clock_container" class="clock-container"></div>
<div class="wrapper">
<p><span id="gl"></span></p>
<p><span id="nl"></span> <span id="weekday"></span></p>
</div>
</div>
</div>
</div>
</div>
</div>
<script src="http://a.tbcdn.cn/p/tao123/1.0/tao123-base-pkg-min.js?t=20100906181901"></script>
<script src="http://a.tbcdn.cn/p/tao123/1.0/fp/fp-pkg-min.js?t=20100906181901"></script>
</body>
</html>
相当于数码管显示，呵呵。
<html>
<head>
<head>
<body>
<div style="width:60px;height:120px;position:relative;top:200px;left:200px;"> <div id="h_1" style="height:60px; width:10px;background:blue;position:absolute;"></div>
<div id="h_2" style="height:60px; width:10px;background:blue;position:absolute;top:60px;"></div>
<div id="h_3" style="height:60px; width:10px;background:blue;position:absolute;top:60px;left:50px;"></div>
<div id="h_4" style="height:60px; width:10px;background:blue;position:absolute;left:50px;"></div>
<div id="h_5" style="height:10px; width:40px;background:blue;position:absolute;left:10px;overflow:hidden"></div>
<div id="h_6" style="height:10px; width:40px;background:blue;position:absolute;left:10px;top:110px;overflow:hidden"></div>
<div id="h_7" style="height:10px; width:40px;background:blue;position:absolute;left:10px;top:55px;overflow:hidden"></div> <div id="h_8" style="height:60px; width:10px;background:blue;position:absolute;left:70px;"></div>
<div id="h_9" style="height:60px; width:10px;background:blue;position:absolute;top:60px;left:70px;"></div>
<div id="h_10" style="height:60px; width:10px;background:blue;position:absolute;top:60px;left:120px;"></div>
<div id="h_11" style="height:60px; width:10px;background:blue;position:absolute;left:120px;"></div>
<div id="h_12" style="height:10px; width:40px;background:blue;position:absolute;left:80px;overflow:hidden"></div>
<div id="h_13" style="height:10px; width:40px;background:blue;position:absolute;left:80px;top:110px;overflow:hidden"></div>
<div id="h_14" style="height:10px; width:40px;background:blue;position:absolute;left:80px;top:55px;overflow:hidden"></div> <div id="p1" style="height:30px; width:10px;background:blue;position:absolute;top:25px;left:140px;"></div>
<div id="p2" style="height:30px; width:10px;background:blue;position:absolute;top:70px;left:140px;"></div> <div id="m_1" style="height:60px; width:10px;background:blue;position:absolute;left:160px;"></div>
<div id="m_2" style="height:60px; width:10px;background:blue;position:absolute;top:60px;left:160px"></div>
<div id="m_3" style="height:60px; width:10px;background:blue;position:absolute;top:60px;left:210px;"></div>
<div id="m_4" style="height:60px; width:10px;background:blue;position:absolute;left:210px;"></div>
<div id="m_5" style="height:10px; width:40px;background:blue;position:absolute;left:170px;overflow:hidden"></div>
<div id="m_6" style="height:10px; width:40px;background:blue;position:absolute;left:170px;top:110px;overflow:hidden"></div>
<div id="m_7" style="height:10px; width:40px;background:blue;position:absolute;left:170px;top:55px;overflow:hidden"></div> <div id="m_8" style="height:60px; width:10px;background:blue;position:absolute;left:230px;"></div>
<div id="m_9" style="height:60px; width:10px;background:blue;position:absolute;top:60px;left:230px;"></div>
<div id="m_10" style="height:60px; width:10px;background:blue;position:absolute;top:60px;left:280px;"></div>
<div id="m_11" style="height:60px; width:10px;background:blue;position:absolute;left:280px;"></div>
<div id="m_12" style="height:10px; width:40px;background:blue;position:absolute;left:240px;overflow:hidden"></div>
<div id="m_13" style="height:10px; width:40px;background:blue;position:absolute;left:240px;top:110px;overflow:hidden"></div>
<div id="m_14" style="height:10px; width:40px;background:blue;position:absolute;left:240px;top:55px;overflow:hidden"></div> <div id="s_1" style="height:30px; width:5px;background:blue;position:absolute;top:60px;left:300px;"></div>
<div id="s_2" style="height:30px; width:5px;background:blue;position:absolute;top:90px;left:300px;"></div>
<div id="s_3" style="height:30px; width:5px;background:blue;position:absolute;top:90px;left:320px;"></div>
<div id="s_4" style="height:30px; width:5px;background:blue;position:absolute;top:60px;left:320px;"></div>
<div id="s_5" style="height:5px; width:20px;background:blue;position:absolute;left:300px;top:60px;overflow:hidden;"></div>
<div id="s_6" style="height:5px; width:20px;background:blue;position:absolute;left:300px;top:115px;overflow:hidden;"></div>
<div id="s_7" style="height:5px; width:20px;background:blue;position:absolute;left:300px;top:87px;overflow:hidden;"></div> <div id="s_8" style="height:30px; width:5px;background:blue;position:absolute;top:60px;left:330px;"></div>
<div id="s_9" style="height:30px; width:5px;background:blue;position:absolute;top:90px;left:330px"></div>
<div id="s_11" style="height:30px; width:5px;background:blue;position:absolute;top:60px;left:350px;"></div>
<div id="s_10" style="height:30px; width:5px;background:blue;position:absolute;top:90px;left:350px;"></div>
<div id="s_12" style="height:5px; width:20px;background:blue;position:absolute;left:330px;top:60px;overflow:hidden;"></div>
<div id="s_13" style="height:5px; width:20px;background:blue;position:absolute;left:330px;top:115px;overflow:hidden;"></div>
<div id="s_14" style="height:5px; width:20px;background:blue;position:absolute;left:330px;top:87px;overflow:hidden;"></div>
</div>
</body>
</html>
function g(id){
return document.getElementById(id);
}
onload = function (){
window.setInterval(showTime, 1);
}
function showTime(){
date = new Date();
var h = date.getHours();
var m = date.getMinutes();
var s = date.getSeconds();
g("p1").style.display = (s % 2) ? "none" : "block";
g("p2").style.display = (s % 2) ? "none" : "block";
switch (parseInt(h / 10)) {
case 0 :
g("h_1").style.display = "block";
g("h_2").style.display = "block";
g("h_3").style.display = "block";
g("h_4").style.display = "block";
g("h_5").style.display = "block";
g("h_6").style.display = "block";
g("h_7").style.display = "none";
break;
case 1 :
g("h_1").style.display = "none";
g("h_2").style.display = "none";
g("h_3").style.display = "block";
g("h_4").style.display = "block";
g("h_5").style.display = "none";
g("h_6").style.display = "none";
g("h_7").style.display = "none";
break;
case 2 :
g("h_1").style.display = "none";
g("h_2").style.display = "block";
g("h_3").style.display = "none";
g("h_4").style.display = "block";
g("h_5").style.display = "block";
g("h_6").style.display = "block";
g("h_7").style.display = "block";
break;
case 3 :
g("h_1").style.display = "none";
g("h_2").style.display = "none";
g("h_3").style.display = "block";
g("h_4").style.display = "block";
g("h_5").style.display = "block";
g("h_6").style.display = "block";
g("h_7").style.display = "block";
break;
case 4 :
g("h_1").style.display = "block";
g("h_2").style.display = "none";
g("h_3").style.display = "block";
g("h_4").style.display = "block";
g("h_5").style.display = "none";
g("h_6").style.display = "none";
g("h_7").style.display = "block";
break;
case 5 :
g("h_1").style.display = "block";
g("h_2").style.display = "none";
g("h_3").style.display = "block";
g("h_4").style.display = "none";
g("h_5").style.display = "block";
g("h_6").style.display = "block";
g("h_7").style.display = "block";
break;
}
switch (h % 10) {
case 0 :
g("h_8").style.display = "block";
g("h_9").style.display = "block";
g("h_10").style.display = "block";
g("h_11").style.display = "block";
g("h_12").style.display = "block";
g("h_13").style.display = "block";
g("h_14").style.display = "none";
break;
case 1 :
g("h_8").style.display = "none";
g("h_9").style.display = "none";
g("h_10").style.display = "block";
g("h_11").style.display = "block";
g("h_12").style.display = "none";
g("h_13").style.display = "none";
g("h_14").style.display = "none";
break;
case 2 :
g("h_8").style.display = "none";
g("h_9").style.display = "block";
g("h_10").style.display = "none";
g("h_11").style.display = "block";
g("h_12").style.display = "block";
g("h_13").style.display = "block";
g("h_14").style.display = "block";
break;
case 3 :
g("h_8").style.display = "none";
g("h_9").style.display = "none";
g("h_10").style.display = "block";
g("h_11").style.display = "block";
g("h_12").style.display = "block";
g("h_13").style.display = "block";
g("h_14").style.display = "block";
break;
case 4 :
g("h_8").style.display = "block";
g("h_9").style.display = "none";
g("h_10").style.display = "block";
g("h_11").style.display = "block";
g("h_12").style.display = "none";
g("h_13").style.display = "none";
g("h_14").style.display = "block";
break;
case 5 :
g("h_8").style.display = "block";
g("h_9").style.display = "none";
g("h_10").style.display = "block";
g("h_11").style.display = "none";
g("h_12").style.display = "block";
g("h_13").style.display = "block";
g("h_14").style.display = "block";
break;
case 6 :
g("h_8").style.display = "block";
g("h_9").style.display = "block";
g("h_10").style.display = "block";
g("h_11").style.display = "none";
g("h_12").style.display = "block";
g("h_13").style.display = "block";
g("h_14").style.display = "block";
break;
case 7 :
g("h_8").style.display = "none";
g("h_9").style.display = "none";
g("h_10").style.display = "block";
g("h_11").style.display = "block";
g("h_12").style.display = "block";
g("h_13").style.display = "none";
g("h_14").style.display = "none";
break;
case 8 :
g("h_8").style.display = "block";
g("h_9").style.display = "block";
g("h_10").style.display = "block";
g("h_11").style.display = "block";
g("h_12").style.display = "block";
g("h_13").style.display = "block";
g("h_14").style.display = "block";
break;
case 9 :
g("h_8").style.display = "block";
g("h_9").style.display = "none";
g("h_10").style.display = "block";
g("h_11").style.display = "block";
g("h_12").style.display = "block";
g("h_13").style.display = "block";
g("h_14").style.display = "block";
break;
}
}
switch (parseInt(m / 10)) {
case 0 :
g("m_1").style.display = "block";
g("m_2").style.display = "block";
g("m_3").style.display = "block";
g("m_4").style.display = "block";
g("m_5").style.display = "block";
g("m_6").style.display = "block";
g("m_7").style.display = "none";
break;
case 1 :
g("m_1").style.display = "none";
g("m_2").style.display = "none";
g("m_3").style.display = "block";
g("m_4").style.display = "block";
g("m_5").style.display = "none";
g("m_6").style.display = "none";
g("m_7").style.display = "none";
break;
case 2 :
g("m_1").style.display = "none";
g("m_2").style.display = "block";
g("m_3").style.display = "none";
g("m_4").style.display = "block";
g("m_5").style.display = "block";
g("m_6").style.display = "block";
g("m_7").style.display = "block";
break;
case 3 :
g("m_1").style.display = "none";
g("m_2").style.display = "none";
g("m_3").style.display = "block";
g("m_4").style.display = "block";
g("m_5").style.display = "block";
g("m_6").style.display = "block";
g("m_7").style.display = "block";
break;
case 4 :
g("m_1").style.display = "block";
g("m_2").style.display = "none";
g("m_3").style.display = "block";
g("m_4").style.display = "block";
g("m_5").style.display = "none";
g("m_6").style.display = "none";
g("m_7").style.display = "block";
break;
case 5 :
g("m_1").style.display = "block";
g("m_2").style.display = "none";
g("m_3").style.display = "block";
g("m_4").style.display = "none";
g("m_5").style.display = "block";
g("m_6").style.display = "block";
g("m_7").style.display = "block";
break;
}
switch (m % 10) {
case 0 :
g("m_8").style.display = "block";
g("m_9").style.display = "block";
g("m_10").style.display = "block";
g("m_11").style.display = "block";
g("m_12").style.display = "block";
g("m_13").style.display = "block";
g("m_14").style.display = "none";
break;
case 1 :
g("m_8").style.display = "none";
g("m_9").style.display = "none";
g("m_10").style.display = "block";
g("m_11").style.display = "block";
g("m_12").style.display = "none";
g("m_13").style.display = "none";
g("m_14").style.display = "none";
break;
case 2 :
g("m_8").style.display = "none";
g("m_9").style.display = "block";
g("m_10").style.display = "none";
g("m_11").style.display = "block";
g("m_12").style.display = "block";
g("m_13").style.display = "block";
g("m_14").style.display = "block";
break;
case 3 :
g("m_8").style.display = "none";
g("m_9").style.display = "none";
g("m_10").style.display = "block";
g("m_11").style.display = "block";
g("m_12").style.display = "block";
g("m_13").style.display = "block";
g("m_14").style.display = "block";
break;
case 4 :
g("m_8").style.display = "block";
g("m_9").style.display = "none";
g("m_10").style.display = "block";
g("m_11").style.display = "block";
g("m_12").style.display = "none";
g("m_13").style.display = "none";
g("m_14").style.display = "block";
break;
case 5 :
g("m_8").style.display = "block";
g("m_9").style.display = "none";
g("m_10").style.display = "block";
g("m_11").style.display = "none";
g("m_12").style.display = "block";
g("m_13").style.display = "block";
g("m_14").style.display = "block";
break;
case 6 :
g("m_8").style.display = "block";
g("m_9").style.display = "block";
g("m_10").style.display = "block";
g("m_11").style.display = "none";
g("m_12").style.display = "block";
g("m_13").style.display = "block";
g("m_14").style.display = "block";
break;
case 7 :
g("m_8").style.display = "none";
g("m_9").style.display = "none";
g("m_10").style.display = "block";
g("m_11").style.display = "block";
g("m_12").style.display = "block";
g("m_13").style.display = "none";
g("m_14").style.display = "none";
break;
case 8 :
g("m_8").style.display = "block";
g("m_9").style.display = "block";
g("m_10").style.display = "block";
g("m_11").style.display = "block";
g("m_12").style.display = "block";
g("m_13").style.display = "block";
g("m_14").style.display = "block";
break;
case 9 :
g("m_8").style.display = "block";
g("m_9").style.display = "none";
g("m_10").style.display = "block";
g("m_11").style.display = "block";
g("m_12").style.display = "block";
g("m_13").style.display = "block";
g("m_14").style.display = "block";
break;
}