鼠标效果系列教程：会动的眼睛 -pc6资讯

您的位置：首页 → 网页设计 → Flash → 鼠标效果系列教程：会动的眼睛

鼠标效果系列教程：会动的眼睛 时间：2004/11/7 2:26:00来源：本站整理作者：蓝点我要评论(0)

　　　　　　　　　　　　

　　　　　　　　　　　　这次我们要做的效果也非常漂亮，老头的眼睛会跟着你的鼠标转！

　　先准备一张人或动物头像的图片，把它导入你的Flash文件里。当然，你要有耐心，自己在Flash里画也行。先制作眼球。新建一个影片剪辑，在编辑区选择椭圆工具，按住Shift画一个正圆，用从白到灰的渐变色填充。如图1

图1

　　制作瞳孔。新建影片剪辑，也很简单，就是分别用蓝灰、黑色和白色绘制三个大小不等的正圆。如图2

图2

　　组合眼睛。再新建个MC。把第一层命名为眼睛层。把刚才做好的眼球拖入第1帧。打开信息面板，点选中心对齐（看见那9个小方块了吗？点中间的那个。另一个选项就是左上角对齐），在X、Y栏里都输入0。如图3。这样可以精确的定位目标。

图3

　　再把做好的瞳孔拖进这一帧。用同样方法把它定位到中心。如图4。

图4

　　并在属性面板里，把它命名为“tk”。如图5。

图5

　　下面进行最关键的动作脚本的编写。点选眼睛层第1帧，打开动作面板写入如下语句：

X = _xmouse; //获取鼠标位置
Y = ymouse; //注意这里的坐标系统是以眼睛的中心为原点的
L = Math.sqrt(X*X+Y*Y); //计算从原点到鼠标的直线距离
if (L<45) { //如果鼠标指在眼球上
setProperty("tk", _x, X);
setProperty("tk", _y, Y);
} else { //如果鼠标在眼睛外
setProperty("tk", _x, 45/L*X);
setProperty("tk", _y, 45/L*Y);
}

　　简单分析一下编程的思路。首先获取鼠标位置。如果忘了坐标系统的理论，可以再看看本教程第2课。用数学对象中的平方根函数Math.sqrt()计算从眼球中心到鼠标的距离。根据这个值分为两种情况进行处理。

　　一、如果L小于眼球的半径，说明鼠标指在眼睛上了，这时控制瞳孔直接跟随着鼠标就行了。

　　二、当鼠标在眼睛外时，我们画个图分析一下算法。如图6

图6