javascript鼠标跟随器.doc

文档介绍：Javascript鼠标跟随器
设
计
说
明
编写人:王静
编写时间:2012-6-17
一引言 - 3 -
二目的 - 3 -
三工具/原料 - 3 -
四步骤/方法 - 3 -
一定义颜色数组 - 3 -
二初始化参数 - 3 -
四定义鼠标事件 - 4 -
五控制鼠标位置和明亮程度 - 5 -
六计算圆环中心的位置 - 6 -
摘要
如果有一种跟随鼠标移动的文字并能带有缓冲的效果,将会给网页带来一种新鲜的感觉。本节给出了一个跟随鼠标的文的例子,这些文字跟着鼠标移动并具有游走的效果。
本节代码主要使用了鼠标的 onMouseMove 事件、setTimeout函数和 clearTimeout 函数。
一引言
二目的
实现在鼠标在网页上移动时,有一行文字、一张图片或一个小动画总是跟着鼠标,除非把鼠标移出页面,否则,它就总是紧跟着鼠标不放。
三工具/原料
Adobe Dreamweaver CS + IE
四步骤/方法
一定义颜色数组
colours=new Array('ff0000','654321','ff00ff','333333','ff00ff','111111');
amount=; // 将数组长度保存在变量amount中
二初始化参数
Ydelay=0,Xdelay=0; // 设置圆环中心的位置
step=;
currStep=0;
my=0,mx=0; // 记录当前鼠标的位置

('<divid="ie"style="position:absolute;top:0;left:0;"><divstyle="position:relative">');
// 向容器中写入"."字符(闪烁的星星即是从"."变化而来的)
for (i=0; i < amount; i++)
('<div id = "iestars" style = "position:absolute; top:0px; left:0px; height:50px; width:50px; color:' +
colours[i] + ';padding-top:15px;text-align:center">..</div>');
brightness = 1; // 初始化亮度的值
gstep = 1; // 每次亮度变化的值
四定义鼠标事件
function iMouse(){
my = ;
mx = ;
}
= iMouse;
//使星星变暗()
function dark(){
brightness -= gstep;
dt=setTimeout('dark()',10);
if (brightness < 2){
clearTimeout(dt);
glow();
}
}
// 使星星变亮
function glow(){
brightness += gstep;
gt=setTimeout('glow()',1