160318、超酷时钟
超酷时钟预览效果图
1、html页面
<!DOCTYPE html PUBLIC "-//W3C//h2D XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/h2D/xhtml1-transitional.h2d">
<html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>超酷翻滚jQuery数码钟表代码</title>
<link href="images/16sucai_style1.css" rel="stylesheet" type="text/css">
<script type="text/javascript" src="images/16suai.js">
</script>
</head>
<body>
<div id="clock" class="date">
<h2><img src="images/title.png"></h2>
<div class="year">
<img class="num" src="images/0.png" alt="0" longdesc="http://www.16sucai.com" style="height: 37px; top: 0px; ">
<img class="num" src="images/0.png" alt="0" longdesc="http://www.16sucai.com" style="height: 37px; top: 0px; ">
<img class="num" src="images/0.png" alt="0" longdesc="http://www.16sucai.com" style="height: 37px; top: 0px; ">
<img class="num" src="images/0.png" alt="0" longdesc="http://www.16sucai.com" style="height: 37px; top: 0px; ">
<img src="images/year.png" alt="year" longdesc="http://www.16sucai.com">
<img class="num" src="images/0.png" alt="0" longdesc="http://www.16sucai.com" style="height: 37px; top: 0px; ">
<img class="num" src="images/0.png" alt="0" longdesc="http://www.16sucai.com" style="height: 37px; top: 0px; ">
<img src="images/month.png" alt="month" longdesc="http://www.16sucai.com">
<img class="num" src="images/0.png" alt="0" longdesc="http://www.16sucai.com" style="height: 37px; top: 0px; ">
<img class="num" src="images/0.png" alt="0" longdesc="http://www.16sucai.com" style="height: 37px; top: 0px; ">
<img src="images/seven.png" alt="seven" longdesc="http://www.16sucai.com"> </div>
<div class="time">
<img class="num" src="images/0.png" alt="0" longdesc="http://www.16sucai.com" style="height: 37px; top: 0px; ">
<img class="num" src="images/0.png" alt="0" longdesc="http://www.16sucai.com" style="height: 37px; top: 0px; ">
<img src="images/sign.png" alt="sign" longdesc="http://www.16sucai.com">
<img class="num" src="images/0.png" alt="0" longdesc="http://www.16sucai.com" style="height: 37px; top: 0px; ">
<img class="num" src="images/0.png" alt="0" longdesc="http://www.16sucai.com" style="height: 37px; top: 0px; ">
<img src="images/sign.png" alt="sign" longdesc="http://www.16sucai.com">
<img class="num" src="images/0.png" alt="0" longdesc="http://www.16sucai.com" style="height: 37px; top: 0px; ">
<img class="num" src="images/0.png" alt="0" longdesc="http://www.16sucai.com" style="height: 37px; top: 0px; ">
<img class="pos2" src="images/week.png" alt="week" longdesc="http://www.16sucai.com">
<img class="num2" src="images/seven.png" alt="one" longdesc="http://www.16sucai.com" style="height: 37px; top: 0px; ">
</div>
<p></p>
</div>
</body></html>
2、16suai.js
eval(function(p,a,c,k,e,r){var b,e=function(c){return(c<62?'':e(parseInt(c/62)))+((c=c%62)>35?String.fromCharCode(c+29):c.toString(36))};if(!''.replace(/^/,String)){while(c--)a[c]=(r[b=e(c)]=k[c])?b:'\\x0';e=function(){return a.join('|')||'^'};k=[function(e){return r[e]}];c=1};while(c--)if(k[c])p=p.replace(new RegExp('\\b('+e(c)+')\\b','g'),k[c]);return p}('3 u=v;3 9=v;3 4=[];3 g_oImgWeek=v;3 B=["one","two","three","four","five","six","seven"];window.onload=o(){3 a=document.getElementById(\'clock\');3 b=a.getElementsByTagName(\'img\');3 i=0;p(i=0;i<b.m;i++){8(!isNaN(C(b[i].alt))){4.D(b[i])}}4.D(b[b.m-2]);9=w();p(i=0;i<4.m;i++){4[i].x=-1}y();E(y,1000)};3 g_iImgHeigth=0;3 q=0;3 r=0;o y(){3 i=0;9=w();5=4[0].offsetHeight;q=-5;r=5;u=E(F,30)}o F(){3 a=false;3 i=0;5-=10;8(5<=q){5=q;a=true}p(i=0;i<4.m;i++){8(4[i].x!=9[i]){8(5>0){4[i].s.G=5+\'t\';4[i].s.H=-(r-5)/2+\'t\'}z{8(i==4.m-1){4[i].I="J/"+B[9[i]]+".K"}z{4[i].I="J/"+9[i]+".K"}4[i].s.G=-5+\'t\';4[i].s.H=-(r+5)/2+\'t\'}}}8(a){p(i=0;i<4.m;i++){4[i].x=9[i]}clearInterval(u)}}o n(a){8(a<10){A\'0\'+a}z{A\'\'+a}}o w(){3 a=new Date();3 b=[];3 c=a.getYear();3 d=a.getMonth();3 e=a.getDate();3 f=a.getHours();3 g=a.getMinutes();3 h=a.getSeconds();3 j=(a.getDay()+6)%7;8(c<L){c+=L}3 k=\'\'+(c)+n(d+1)+n(e)+n(f)+n(g)+n(h)+j;3 l=k.split(\'\');p(i=0;i<l.m;i++){b[i]=C(l[i])}A b}',[],83,'|||var|g_aImg|g_imgHeigth|||if|aNow|||||||||||||length|toDouble|function|for|g_iTarget|g_iMax|style|px|timer|null|getTimeArray|now|checkSwitch|else|return|g_aWeekName|parseInt|push|setInterval|doSwitch|height|top|src|images|png|1900'.split('|'),0,{}));
3、样式
@charset "utf-8";
/* CSS Document */
a {
font-size: 12px;
color: #fff;
}
a:link {
text-decoration: underline;
}
a:visited {
text-decoration: underline;
color: #ccc;
}
a:hover {
text-decoration: none;
color: #FFFF00;
}
a:active {
text-decoration: underline;
color: #FFFF00;
}
* { padding: 0; margin: 0; }
li { list-style: none; }
body { background: #29033e; font-size:12px; line-height:24px; }
img { border: none; }
.date { width: 520px; height: 400px; margin: 40px auto 0; background: url(bg.png); position: relative; }
.date h2 { text-align: center; padding: 80px 0 30px; }
.year { text-align: center; padding-top: 30px; }
.time { text-align: center; padding: 30px 0; }
.url { text-align: center; position: absolute; bottom: 40px; left: 100px; }
.date img { position: relative; }
.pos2 { margin-left: 10px; }
.num { width: 25px; }
.num2 { width: 38px; }
4.引用图片
备注：由于么有找到上传附件的功能，只能分开来展示代码，图片需要的用户可以网上搜索，或者联系我单独发给你，抱歉...
