`
morris
  • 浏览: 179075 次
  • 性别: Icon_minigender_1
  • 来自: 深圳
社区版块
存档分类
最新评论

跟隨鼠標的時間

    博客分类:
  • ajax
阅读更多
引用
script language="JavaScript">
<!-- Begin
dCol='99CC00';
fCol='FF9900';
sCol='3366FF';
mCol='3366FF';
hCol='3366FF';
ClockHeight=40;
ClockWidth=40;
ClockFromMouseY=0;
ClockFromMouseX=100;
d=new Array("SUNDAY","MONDAY","TUESDAY","WEDNESDAY","THURSDAY","FRIDAY","SATURDAY");
m=new Array("JANUARY","FEBRUARY","MARCH","APRIL","MAY","JUNE","JULY","AUGUST","SEPTEMBER","OCTOBER","NOVEMBER","DECEMBER");
date=new Date();
day=date.getDate();
year=date.getYear();
if (year < 2000) year=year+1900;
TodaysDate=" "+d[date.getDay()]+" "+day+" "+m[date.getMonth()]+" "+year;
D=TodaysDate.split('');
H='...';
H=H.split('');
M='....';
M=M.split('');
S='.....';
S=S.split('');
Face='1 2 3 4 5 6 7 8 9 10 11 12';
font='Arial';
size=1;
speed=0.6;
ns=(document.layers);
ie=(document.all);
Face=Face.split(' ');
n=Face.length;
a=size*10;
ymouse=0;
xmouse=0;
scrll=0;
props="<font face="+font+" size="+size+" color="+fCol+"><B>";
props2="<font face="+font+" size="+size+" color="+dCol+"><B>";
Split=360/n;
Dsplit=360/D.length;
HandHeight=ClockHeight/4.5
HandWidth=ClockWidth/4.5
HandY=-7;
HandX=-2.5;
scrll=0;
step=0.06;
currStep=0;
y=new Array();x=new Array();Y=new Array();X=new Array();
for (i=0; i < n; i++){y[i]=0;x[i]=0;Y[i]=0;X[i]=0}
Dy=new Array();Dx=new Array();DY=new Array();DX=new Array();
for (i=0; i < D.length; i++){Dy[i]=0;Dx[i]=0;DY[i]=0;DX[i]=0}
if (ns){
for (i=0; i < D.length; i++)
document.write('<layer name="nsDate'+i+'" top=0 left=0 height='+a+' width='+a+'><center>'+props2+D[i]+'</font></center></layer>');
for (i=0; i < n; i++)
document.write('<layer name="nsFace'+i+'" top=0 left=0 height='+a+' width='+a+'><center>'+props+Face[i]+'</font></center></layer>');
for (i=0; i < S.length; i++)
document.write('<layer name=nsSeconds'+i+' top=0 left=0 width=15 height=15><font face=Arial size=3 color='+sCol+'><center><b>'+S[i]+'</b></center></font></layer>');
for (i=0; i < M.length; i++)
document.write('<layer name=nsMinutes'+i+' top=0 left=0 width=15 height=15><font face=Arial size=3 color='+mCol+'><center><b>'+M[i]+'</b></center></font></layer>');
for (i=0; i < H.length; i++)
document.write('<layer name=nsHours'+i+' top=0 left=0 width=15 height=15><font face=Arial size=3 color='+hCol+'><center><b>'+H[i]+'</b></center></font></layer>');
}
if (ie){
document.write('<div id="Od" style="position:absolute;top:0px;left:0px"><div style="position:relative">');
for (i=0; i < D.length; i++)
document.write('<div id="ieDate" style="position:absolute;top:0px;left:0;height:'+a+';width:'+a+';text-align:center">'+props2+D[i]+'</B></font></div>');
document.write('</div></div>');
document.write('<div id="Of" style="position:absolute;top:0px;left:0px"><div style="position:relative">');
for (i=0; i < n; i++)
document.write('<div id="ieFace" style="position:absolute;top:0px;left:0;height:'+a+';width:'+a+';text-align:center">'+props+Face[i]+'</B></font></div>');
document.write('</div></div>');
document.write('<div id="Oh" style="position:absolute;top:0px;left:0px"><div style="position:relative">');
for (i=0; i < H.length; i++)
document.write('<div id="ieHours" style="position:absolute;width:16px;height:16px;font-family:Arial;font-size:16px;color:'+hCol+';text-align:center;font-weight:bold">'+H[i]+'</div>');
document.write('</div></div>');
document.write('<div id="Om" style="position:absolute;top:0px;left:0px"><div style="position:relative">');
for (i=0; i < M.length; i++)
document.write('<div id="ieMinutes" style="position:absolute;width:16px;height:16px;font-family:Arial;font-size:16px;color:'+mCol+';text-align:center;font-weight:bold">'+M[i]+'</div>');
document.write('</div></div>')
document.write('<div id="Os" style="position:absolute;top:0px;left:0px"><div style="position:relative">');
for (i=0; i < S.length; i++)
document.write('<div id="ieSeconds" style="position:absolute;width:16px;height:16px;font-family:Arial;font-size:16px;color:'+sCol+';text-align:center;font-weight:bold">'+S[i]+'</div>');
document.write('</div></div>')
}
(ns)?window.captureEvents(Event.MOUSEMOVE):0;
function Mouse(evnt){
ymouse = (ns)?evnt.pageY+ClockFromMouseY-(window.pageYOffset):event.y+ClockFromMouseY;
xmouse = (ns)?evnt.pageX+ClockFromMouseX:event.x+ClockFromMouseX;
}
(ns)?window.onMouseMove=Mouse:document.onmousemove=Mouse;
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;
if (ie){
Od.style.top=window.document.body.scrollTop;
Of.style.top=window.document.body.scrollTop;
Oh.style.top=window.document.body.scrollTop;
Om.style.top=window.document.body.scrollTop;
Os.style.top=window.document.body.scrollTop;
}
for (i=0; i < n; i++){
var F=(ns)?document.layers['nsFace'+i]:ieFace[i].style;
F.top=y[i] + ClockHeight*Math.sin(-1.0471 + i*Split*Math.PI/180)+scrll;
F.left=x[i] + ClockWidth*Math.cos(-1.0471 + i*Split*Math.PI/180);
}
for (i=0; i < H.length; i++){
var HL=(ns)?document.layers['nsHours'+i]:ieHours[i].style;
HL.top=y[i]+HandY+(i*HandHeight)*Math.sin(hrs)+scrll;
HL.left=x[i]+HandX+(i*HandWidth)*Math.cos(hrs);
}
for (i=0; i < M.length; i++){
var ML=(ns)?document.layers['nsMinutes'+i]:ieMinutes[i].style;
ML.top=y[i]+HandY+(i*HandHeight)*Math.sin(min)+scrll;
ML.left=x[i]+HandX+(i*HandWidth)*Math.cos(min);
}
for (i=0; i < S.length; i++){
var SL=(ns)?document.layers['nsSeconds'+i]:ieSeconds[i].style;
SL.top=y[i]+HandY+(i*HandHeight)*Math.sin(sec)+scrll;
SL.left=x[i]+HandX+(i*HandWidth)*Math.cos(sec);
}
for (i=0; i < D.length; i++){
var DL=(ns)?document.layers['nsDate'+i]:ieDate[i].style;
DL.top=Dy[i] + ClockHeight*1.5*Math.sin(currStep+i*Dsplit*Math.PI/180)+scrll;
DL.left=Dx[i] + ClockWidth*1.5*Math.cos(currStep+i*Dsplit*Math.PI/180);
}
currStep-=step;
}
function Delay(){
scrll=(ns)?window.pageYOffset:0;
Dy[0]=Math.round(DY[0]+=((ymouse)-DY[0])*speed);
Dx[0]=Math.round(DX[0]+=((xmouse)-DX[0])*speed);
for (i=1; i < D.length; i++){
Dy[i]=Math.round(DY[i]+=(Dy[i-1]-DY[i])*speed);
Dx[i]=Math.round(DX[i]+=(Dx[i-1]-DX[i])*speed);
}
y[0]=Math.round(Y[0]+=((ymouse)-Y[0])*speed);
x[0]=Math.round(X[0]+=((xmouse)-X[0])*speed);
for (i=1; i < n; i++){
y[i]=Math.round(Y[i]+=(y[i-1]-Y[i])*speed);
x[i]=Math.round(X[i]+=(x[i-1]-X[i])*speed);
}
ClockAndAssign();
setTimeout('Delay()',20);
}
if (ns||ie)window.onload=Delay;
// End -->
</script>


好用吧!
分享到:
评论

相关推荐

    wpf动画 - 跟随鼠标移动

    "跟随鼠标移动"这一主题在WPF动画中是相当常见的应用场景,比如创建一个对象,如一个小球或者图标,让它随着鼠标的移动而移动。这在设计动态用户界面时非常有用,可以提升用户体验,吸引用户的注意力。 要实现WPF中...

    跟随鼠标的五彩气泡星星

    标题中的“跟随鼠标的五彩气泡星星”指的是一个电脑桌面美化程序,它能实现一个动态效果:当鼠标移动时,屏幕上会出现五颜六色的气泡或星星,它们会跟随鼠标指针的移动而移动,营造出一种梦幻且有趣的视觉体验。...

    跟随鼠标的日期时间表盘

    跟随鼠标的跟随鼠标的日期时间表盘日期时间表盘

    网页特效——时间日期篇2

    时间日期特效2,包括跟随鼠标罗马时钟,跟随鼠标时间2,跟随鼠标时间3,跟随鼠标1,固定挂钟,固定的页面时钟,固定右上角时钟,计算当月还剩天数,计算两个日期之差,计算任意一天星期几,计算星座与属相,记录几...

    js+css3猫头鹰眼睛跟随鼠标指针转动动画特效

    在本项目中,"js+css3猫头鹰眼睛跟随鼠标指针转动动画特效"是一个巧妙结合了JavaScript和CSS3技术实现的互动效果。这个特效主要用于网页设计,为用户提供一个有趣的用户体验,使得猫头鹰头像的眼睛能够跟随用户的...

    前端实现鼠标跟随动画

    例如,创建一个圆圈跟随鼠标移动的CSS3动画: ```css .follow-me { position: absolute; width: 50px; height: 50px; border-radius: 50%; background-color: #f00; transition: all 0.3s ease; } body:...

    易语言图标跟随鼠标移动源码.7z

    在这个"易语言图标跟随鼠标移动源码.7z"压缩包中,包含的是一个易语言编写的程序源代码,该源码实现了图标跟随鼠标移动的功能。这一功能在很多软件或应用程序中都有应用,例如鼠标指针工具、游戏辅助等。 首先,...

    文字跟随鼠标小实例

    在本教程中,我们将深入探讨如何使用ActionScript 3(AS3)和Flash Develop来创建一个简单的“文字跟随鼠标”小实例。这个实例是Flash编程中的一个基础动态效果,能够帮助初学者理解AS3的基本语法和事件处理。 首先...

    很好的飘浮文字跟随鼠标

    【标题】:“很好的飘浮文字跟随鼠标”技术详解 在网页设计中,飘浮文字跟随鼠标的效果是一种常见的交互设计手法,它可以为用户带来独特的浏览体验。这种效果通常应用于广告、提示信息或者导航元素中,使得信息能...

    TweenMax类实现图片跟随鼠标移动而变化

    在本场景中,我们关注的是如何利用TweenMax实现图片跟随鼠标移动而变化的效果。 首先,我们需要了解TweenMax的基本用法。TweenMax可以对任何数值属性进行动画处理,包括位置、颜色、大小等。它通过定义开始值、结束...

    fengche.rar_windmill_跟随鼠标_跟随鼠标 移动

    在IT行业中,交互式设计和动态效果是提升用户体验的重要手段,本项目"风车.rar_windmill_跟随鼠标_跟随鼠标 移动"就是一个生动的例子。这个项目的核心在于实现了一个能够跟随鼠标移动并根据鼠标移动速度改变转动速度...

    flash 鼠标跟随效果 flash素材

    2. 更新对象位置:将对象的x和y坐标设置为鼠标坐标,让对象跟随鼠标移动。 ```actionscript myObject.x = mouseX; myObject.y = mouseY; ``` 3. 添加事件监听器:为了持续跟踪鼠标移动,我们需要在`EnterFrame`事件...

    对话框跟随鼠标位置测试_vi鼠标跟随_对话框_鼠标位置_跟随_源码

    本项目涉及的主题是“对话框跟随鼠标位置测试”,这是一项关于如何在用户交互时动态调整对话框位置的技术。这项技术常用于提高用户体验,特别是在需要频繁与对话框进行交互的场景下。 首先,我们需要理解“对话框”...

    html鼠标跟随移动的例子

    HTML鼠标跟随移动是一种常见的网页交互效果,用户在页面上移动鼠标时,某个元素会跟随鼠标的移动轨迹进行相应的位移。这种效果可以增加用户的互动体验,常见于游戏、设计展示或者个性化网页中。本示例将围绕“html...

    jQuery图片跟随鼠标左右摆动.zip

    在本项目"jQuery图片跟随鼠标左右摆动.zip"中,主要涉及的是使用JavaScript库jQuery以及CSS3技术来创建一个互动的网页特效,使得图片能够随着鼠标的移动而在水平方向上进行动态摆动。这种效果可以增加网站的互动性和...

    鼠标跟随特效flash swf

    在IT行业中,交互设计是提升用户体验的关键因素之一,而“鼠标跟随特效”就是其中一种吸引用户注意力并增强交互感的设计手法。本主题聚焦于利用Flash技术实现的SWF格式的鼠标跟随特效,常用于电子书和网页制作,以...

    jQuery眼睛跟随鼠标旋转特效

    【jQuery眼睛跟随鼠标旋转特效】是一款使用jQuery库实现的交互式网页元素,它为用户提供了一种独特的视觉体验。这个特效的核心在于,一个形象的眼睛图形会根据用户鼠标的移动轨迹进行实时旋转,仿佛具有磁性般紧随其...

    Flash鼠标跟随 泡泡鼠标动画.rar

    在本文中,我们将深入探讨如何使用Flash的ActionScript来实现鼠标跟随的泡泡动画效果。这个效果是基于Flash的脚本编程技术,对于那些想要提升ActionScript技能或对创建动态交互式内容感兴趣的用户来说,这是一个非常...

    flash as3.0 跟随鼠标的粒子效果

    在本文中,我们将深入探讨如何使用ActionScript 3.0(AS3.0)创建一个跟随鼠标的粒子效果。ActionScript是Adobe Flash Professional中的主要编程语言,用于制作交互式动画和应用程序。粒子效果是一种常见的视觉特效...

Global site tag (gtag.js) - Google Analytics