• 文字广告位
  • 文字广告位
  • 文字广告位
您现在的位置: 站长手册 >> 特效代码 >> 时间类 >> 正文
站内搜索
Google
[图文]右下角悬浮时钟
          ★★★   

右下角悬浮时钟

雅虎收藏夹 百度收藏 Google书签 Yahoo书签 新浪ViVi 搜狐网摘 365Key网摘 天极网摘 diglog 和讯网摘 POCO网摘 YouNote网摘 博拉网 天下图摘 Del.icio.us digg reddit spurl BlinkList blogmarks
人气: 来源:本站原创 作者:佚名 所属栏目:时间类 [切换到繁體中文]
介绍:24小时的时钟,可以显示上下午,可随页面一起滚动。

演示:

[Ctrl+A全选 提示:你可先修改部分代码,再按运行]

下面教你如何应用此特效: 
 --------------------------------------------------------------------------------------
  需要在<body 这里>加入的代码:
 --------------------------------------------------------------------------------------
以下代码加到<head>…</head>中
以下代码加到<body>…</body>中
<script language="JavaScript">
<!--
ClockFace=new Image();
milCol='#000000';
civCol='#000000';
dotCol='#000000';//dot colour.
hCol='#FF9900';//hours colour.
mCol='#FF9900';//minutes colour.
sCol='#FF9900';//seconds colour.
ampmCol='#cccccc';
ns=(document.layers);
ns6=(document.getElementById&&!document.all);
ie=(document.all);
h=3;
m=4;
s=5;
civ='1 2 3 4 5 6 7 8 9 10 11 12';
civ=civ.split(' ');
mil='13 14 15 16 17 18 19 20 21 22 23 24';
mil=mil.split(' ');
n=civ.length;
ClockHeight=30;
ClockWidth=30;
f24="<font face='Arial' size=1 color="+milCol+">";
f12="<font face='Arial' size=1 color="+civCol+">";
e=360/n;
HandHeight=ClockHeight/4;
HandWidth=ClockWidth/4;
y=0;
x=0;
if (!ns)
document.write('<div id="glass" style="position:absolute"></div>');
else
document.write("<layer name='glass' top=0 left=0></layer>");
if (!ns)
document.write("<div id='disp' style='position:absolute;width:50px;height:20px;text-align:center'> </div>");
else
document.write("<layer name=disp top=0 left=0></layer>");
for (i=0; i < n; i++){
if (!ns)
document.write('<div id="Mil'+i+'" style="position:absolute;width:15px;height:15px;text-align:center;color:#0000dd">'+f24+mil[i]+'</font></div>');
else
document.write('<layer name="Mil'+i+'" width=15 height=15><center>'+f24+mil[i]+'</font></center></layer>');
}
for (i=0; i < n; i++){
if (!ns)
document.write('<div id="Civ'+i+'" style="position:absolute;width:15px;height:15px;text-align:center;color:#0000dd">'+f12+civ[i]+'</font></div>');
else
document.write('<layer name="Civ'+i+'" width=15 height=15><center>'+f12+civ[i]+'</font></center></layer>');
}
for (i=0; i < n; i++){
if (!ns)
document.write('<div id="D'+i+'" style="position:absolute;width:2px;height:2px;font-size:2px;background:'+dotCol+'"></div>');
else
document.write('<layer name="D'+i+'" bgcolor='+dotCol+' width=2 height=2></layer>');
}
for (i=0; i < h; i++){
if (!ns)
document.write('<div id="H'+i+'" style="position:absolute;width:2px;height:2px;font-size:2px;background:'+hCol+'"></div>');
else
document.write('<layer name="H'+i+'" bgcolor='+hCol+' width=2 height=2></layer>');
}
for (i=0; i < m; i++){
if (!ns)
document.write('<div id="M'+i+'" style="position:absolute;width:2px;height:2px;font-size:2px;background:'+mCol+'"></div>');
else
document.write('<layer name="M'+i+'" bgcolor='+mCol+' width=2 height=2></layer>');
}
for (i=0; i < s; i++){
if (!ns)
document.write('<div id="S'+i+'" style="position:absolute;width:2px;height:2px;font-size:2px;background:'+sCol+'"></div>');
else
document.write('<layer name="S'+i+'" bgcolor='+sCol+' width=2 height=2></layer>');
}
function ClockAndAssign(){
time = new Date ();
secs = time.getSeconds();
sec = -1.57 + Math.PI * secs/30;
mins = time.getMinutes();
min = -1.57 + Math.PI * mins/30;
hr = time.getHours();
hrs = -1.575 + Math.PI * hr/6+Math.PI*parseInt(time.getMinutes())/360;
ampm=(hr > 11)?"PM":"AM";
y=(ie)?document.body.scrollTop+window.document.body.clientHeight-ClockHeight*2.4:window.pageYOffset+window.innerHeight-ClockHeight*2.4;
x=(ie)?document.body.scrollLeft+window.document.body.clientWidth-ClockWidth*2.4:window.pageXOffset+window.innerWidth-ClockWidth*2.9;
Dspf=(ie)?glass.style:(ns6)?document.getElementById("glass").style:document.glass;
Dspf.top=y-71;
Dspf.left=x-70;
Dsp=(ie)?disp.style:(ns6)?document.getElementById("disp").style:document.disp;
Dsp.top=y-17;
Dsp.left=x-24;
for (i=0; i < s; i++){
CS=(ie)?document.all["S"+i].style:(ns6)?document.getElementById("S"+i).style:document.layers["S"+i];
CS.top=y+(i*HandHeight)*Math.sin(sec);
CS.left=x+(i*HandWidth)*Math.cos(sec);
}
for (i=0; i < m; i++){
CM=(ie)?document.all["M"+i].style:(ns6)?document.getElementById("M"+i).style:document.layers["M"+i];
CM.top=y+(i*HandHeight)*Math.sin(min);
CM.left=x+(i*HandWidth)*Math.cos(min);
}
for (i=0; i < h; i++){
CH=(ie)?document.all["H"+i].style:(ns6)?document.getElementById("H"+i).style:document.layers["H"+i];
CH.top=y+(i*HandHeight)*Math.sin(hrs);
CH.left=x+(i*HandWidth)*Math.cos(hrs);
}
for (i=0; i < n; i++){
CD=(ie)?document.all["D"+i].style:(ns6)?document.getElementById("D"+i).style:document.layers["D"+i];
CD.top=y+ ClockHeight*Math.sin(-1.0471 + i*e*Math.PI/180);
CD.left=x+ ClockWidth*Math.cos(-1.0471 + i*e*Math.PI/180);
}
for (i=0; i < n; i++){
CC=(ie)?document.all["Civ"+i].style:(ns6)?document.getElementById("Civ"+i).style:document.layers["Civ"+i];
CC.top=y-6 + ClockHeight*1.4*Math.sin(-1.0471 + i*e*Math.PI/180);
CC.left=x-6 + ClockWidth*1.4*Math.cos(-1.0471 + i*e*Math.PI/180);
}
for (i=0; i < n; i++){ 
CM=(ie)?document.all["Mil"+i].style:(ns6)?document.getElementById("Mil"+i).style:document.layers["Mil"+i];
CM.top=y-6 + ClockHeight*1.9*Math.sin(-1.0471 + i*e*Math.PI/180);
CM.left=x-6 + ClockWidth*1.9*Math.cos(-1.0471 + i*e*Math.PI/180);
}
setTimeout('ClockAndAssign()',100);
if (ie)disp.innerHTML='<font face=Arial size=6 color='+ampmCol+'>'+ampm+'</font>';
if (ns){
document.disp.document.open();
document.disp.document.write('<font face=Arial size=6 color='+ampmCol+'>'+ampm+'</font>');
document.disp.document.close();
}
}
function aorp(){
if (ns6)
document.getElementById("disp").innerHTML='<font face=Arial size=6 color='+ampmCol+'>'+ampm+'</font>';
setTimeout('aorp()',60000);
}
ClockAndAssign();
if (ns6)aorp();
//-->
</script>
  • 上一个特效:
  • 下一个特效:
  • 网友评论:(只显示最新10条。评论内容只代表网友观点,与本站立场无关!)
    姓 名: *(必填项) ·注册用户·
    Email: QQ号:
    评 分: 1分 2分 3分 4分 5分
    • 您可以发表评论支持你喜欢的文章。
    • 请遵守《互联网电子公告服务管理规定》
    • 请遵守中华人民共和国各项有关法律法规。
    • 严禁发表危害国家安全、政治、黄色淫秽等内容的评论。
    • 评论人需对自己在使用评论过程中的行为承担法律责任。
    • 本站管理员有权保留或删除评论内容。
    • 评论内容只代表个人观点,与本网站立场无关。
    站内特效搜索
    | 设为首页 | 加入收藏 | 联系站长 | 友情链接 | 版权申明 | | 京ICP备 05004866号 |
    版权所有 2007-2008 站长手册 WWW.ZZSC.ORG 业务联系 zzsc.org#gmail.com