| VB 源码 | VC 源码 | ASP源码 | JSP源码 | PHP源码 | CGI源码 | FLASH源码 | 素材模板 | C 源程序 | 站长工具 | 站长教程 |

网页设计

网站策划
网页设计

本类阅读TOP10

·经典网页设计欣赏
·Flash Loading制作全接触
·用Flash制作简单闪光字
·下拉菜单全攻略(Javascript篇)
·PhotoShop热键大全
·下拉菜单全攻略(DW篇)
·网页效果集合
·哈利波特书封面设计欣赏
·Flex 入门教程
·一流的设计师,一流的PHOTOSHOP教程

站内搜索

鼠标效果系列教程(二)简单跟随
概述

鼠标跟随的效果可谓千变万化,但是万变不离其宗,掌握了最基本的做法,再做其它更复杂的,也就相对容易了。当然,要做出真正漂亮的作品,丰富的想象力也是必不可少的。在下面的几节中,我们就由浅入深的讨论一下鼠标跟随的具体实现方法。
先来看看鼠标跟随的理论基础。最基本的就是获取跟随物体和鼠标的位置。


一、获取跟随物体的位置
用_x和_y这对属性来获取场景中实例的当前位置,这个大家应该非常熟悉了,_x和_y的值表示以场景的左上角为原点,向右为X轴正向,向下为Y轴正向的坐标系中,实例的坐标值。这里提到的,就是Flash的主坐标系统。而对于影片剪辑,它们还有各自独立的,以自己的中心为原点的坐标系统。弄清楚这一点,对于以后的编程很重要。如图1所示。

二、获取鼠标的位置
鼠标的位置,可以用_xmouse和_ymouse这对属性来获取。这时就要注意坐标系统的区别了。对于某个影片剪辑的_xmouse和_ymouse属性,其值是以其自身的坐标系统为基础的。例如图1中,影片剪辑“mc”的位置是(200,200),当鼠标位于A点(100,100)时,mc._xmouse= -100,mc._ymouse= -100。

点击打开新窗口

图1

三、鼠标跟随的算法
有了上面的这些理论基础,接下来就是实现跟随的算法了。介绍一种最常用的算法:带有加速度的跟随。大概的思路是这样,算出当前实例和鼠标之间的距离,比如是100,设定一个百分比,比如50%,使该实例向鼠标移动这段距离的50%,100*50%=50,这样它和鼠标的距离就还有50。接着,再让它移动当前距离的50%,这次是50*50%=25。重复这样做,最后实际的结果就是,第一次,移动了50,第二次是25,第三次是12.5,……这样就模拟了物体向着目标开始快、越靠近越慢的减速运动的过程。
我们就用这个算法做个简单的跟随效果。

制作步骤

一、制作跟随图案
打开Flash MX,新建文件,新建一个影片剪辑,设计制作一个图案放入第一帧。如图2所示。

点击打开新窗口

图2

二、编写动作
点选这一帧,打开动作面板,加入如下语句:

A = 8; // 调节A的值可改变跟随速度
this._x = this._x+_xmouse/A;
this._y = this._y+_ymouse/A;

注意,因为这段语句是加在影片剪辑中的,所以这里的_xmouse和_ymouse的值就等于影片剪辑和鼠标之间的矢量距离。为什么?再回过头去看看关于影片剪辑自身的坐标系统的理论就明白了。this._x = this._x+_xmouse/A就使MC向鼠标移动了它们之间X轴方向距离的八分之一,同理,this._y = this._y+_ymouse/A一句控制Y轴方向的运动。好,程序就是这么简单!

三、制作循环
接下来,在第二帧,按F6增加一个关键帧。这一帧主要是在影片剪辑内构成一个循环,使第一帧的程序能够不断的被执行。
最后,把做好的影片剪辑拖入场景中就行了。按Ctrl+Enter测试一下,是不是很有成就感?

Flash动画:
/up/upfile/txt/20037151622570.swf

小结
本节讨论了鼠标跟随的理论基础,并介绍了一种最常用的跟随算法,加速度使最终效果更具真实感。如果把网站的图标做成这种跟随,会给人留下比较深刻的印象。建议读者朋友们熟练的掌握这种算法,因为许多复杂的效果都是以它为基础的,例如下一节我们将要介绍的“游动的鱼”。
现在再想一下上一节给大家提出的问题,是不是很简单了?只要把本例中模拟加速度的部分去掉,改成类似下面的语句就行了:
this._x = _root._xmouse;
this._y = _root._ymouse;

好,休息一下,准备进入下一节的学习。

源文件下载




相关文章
  • 阅读优秀代码是提高开发人员修为的一种捷径
  • 你是世界上最优秀的开发人员吗?
  • 计算机科学专业应该传授的三件事
  • 五个htaccess文件的常用技巧
  • Spring框架研究
  • 十四条实用的MySQL 查询语句
  • 十个JavaScript页面布局技巧
  • 十个最著名的JavaScript 库
  • PHP的新浪微博发信接口
  • 常见的开源软件许可证协议介绍
  • 开源软件许可证知识产权问题
  • 应用最广的十大Javascript框架
  • JAVA程序的加密和反加密
  • 在JAVA中编程实现数字签名系统
  • PHP开发框架的现状和展望
  • 网站标准重构的基础知识
  • Linux扫盲篇:CentOS、Ubuntu、Gentoo
  • 每个PHP开发者应该知道的五个开发要点
  • 如何在您的网站中加入“搜索本站功能”
  • 花十二个月建立一个成功的网站
  • 相关软件

  • Photoshop中文教程
  • TURBO C教程  
  • CUG输入编缉,打字教程的C语言源程序  
  • C语言教程  
  • 功能强大的 TC 教程  
  • TURBO-C 教程的C语言源码  
  • 超级文本C++教程  
  • 操作符重载C++教程  
  • C 语言教程  
  • PHP中文教程  

  • 下载首页关于我们广告服务联系方式常见问题隐私声明法律条款本站声明下载帮助发布软件站点地图谷歌卫星地图