网页特效
建站首页
|
广告代码
|
源码下载
|
站长工具
|
字体下载
|
网页模板
|
收藏本站
|
设为首页
网站首页
菜单导航
日期时间
背景图像
图层样式
鼠标键盘
页面窗口
色彩表格
链接文字
表单按钮
计数转换
游戏娱乐
综合实例
特效
热门搜索:
特效代码
js脚本
导航菜单
热点推荐:
英文字体
人民币汇率
dw插件
站长常用软件
alexa排名查询
您的位置:
网页特效
->
日期时间
-> 特酷的时钟 - 网页特效代码
特酷的时钟 - 网页特效代码
作者:特酷的时钟 - 网页特效代码 发布时间:2007-12-20 17:08:48 发布人: admin
脚本说明: 把如下代码加入<body>区域中 <style type="text/css">.light { FILTER: Light } .date { COLOR: #000000; FONT-FAMILY: "Geneva", "Arial", "Helvetica", "san-serif"; FONT-SIZE: 12px; FONT-WEIGHT: bold; TEXT-ALIGN: center } </style> <script> function setLights(){ var sx=Math.cos(slightDir)*slightr; var sy=Math.sin(slightDir)*slightr; var mx=Math.cos(mlightDir)*mlightr; var my=Math.sin(mlightDir)*mlightr; var hx=Math.cos(hlightDir)*hlightr; var hy=Math.sin(hlightDir)*hlightr; sconDiv.filters.Light.clear(); sconDiv.filters.Light.addCone(sx+72,sy+72,1,73,72,215,255,5,20,1); sconDiv.filters.Light.addCone(mx+72,my+72,1,73,72,255,10,0,20,2); sconDiv.filters.Light.addCone(hx+72,hy+72,1,73,72,15,100,255,20,4); sconDiv.filters.Light.addAmbient(155,155,155,100); } function timeGo(){ var tt=new Date(); slightDir=(tt.getSeconds())/60*6.28-1.57; mlightDir=(tt.getMinutes())/60*6.28-1.57; hlightDir=(tt.getHours())/12*6.28-1.57+mlightDir/6.28*0.52+0.05; dateDiv.innerText=tt.getMonth()+1+"-"+tt.getDate(); setLights(); } function InitClock(){ slightr=110; mlightr=90; hlightr=60; timeGo(); setInterval("timeGo()",1000); } window.onload=InitClock; </script> <div id="clockDiv" style="HEIGHT: 222px; LEFT: 145px; POSITION: absolute; TOP: 12px; WIDTH: 233px; Z-INDEX: 1"> <div class="light" id="sconDiv" style="HEIGHT: 70px; LEFT: 27px; POSITION: absolute; TOP: 22px; WIDTH: 70px; Z-INDEX: 1"><img src="http://web.archive.org/web/20121024085753im_/http://www.alixixi.com/UploadPic/userface/no1323.jpg" width="144" onclick="javascript:window.open(this.src);" style="CURSOR: pointer" onload="return imgzoom(this,550)"></div><img src="http://web.archive.org/web/20121024085753im_/http://www.alixixi.com/UploadPic/userface/no1323.jpg" width="200" onclick="javascript:window.open(this.src);" style="CURSOR: pointer" onload="return imgzoom(this,550)"> <div id="clLayer" style="HEIGHT: 25px; LEFT: 88px; POSITION: absolute; TOP: 80px; WIDTH: 25px; Z-INDEX: 2"><img src="http://web.archive.org/web/20121024085753im_/http://www.alixixi.com/UploadPic/userface/no1323.jpg" width="26" onclick="javascript:window.open(this.src);" style="CURSOR: pointer" onload="return imgzoom(this,550)"></div> <div class="date" id="dateDiv" style="HEIGHT: 16px; LEFT: 85px; POSITION: absolute; TOP: 178px; WIDTH: 32px; Z-INDEX: 3">12-2</div></div> <a href="http://web.archive.org/web/20121024085753/http://myjs.jz123.cn/">欢迎访问中国建站之家网页特效集</a>
特酷的时钟 - 网页特效代码
将本文收藏到QQ书签与更多好友分享
上一篇:文章:
有提示的日历 - 网页特效代码
下一篇:文章:
下拉框显示当前时间 - 网页特效代码
本类浏览排行 »
搜索页面中的内容
又一款综合搜索引擎代码
标题栏显示当前时间
倒影效果的电子表,显示当前时间
自动记录当前页面最新的更新日期
JS让网页每隔2秒弹出一次对话框
一款超酷的CSS列表排行榜
鼠标悬停放大的纯CSS分页效果
本站推荐文章 »
垂直三栏自适应等高布局
仿QQ消息管理器的文本内容样式
支付宝的控制台动画效果菜单
文字、图片拖曳移动
可拉伸移动的DIV层效果
很酷的图片伸缩放大功能
较好的视觉效果的网页选项卡
CSS实例:通过定义渐变边框给图片加阴影