今天刚好改版了，真开心，先祝贺闪客顺利改版。

    这篇教程是接上篇教程的（闪客注：详解导航动画的制作过程），上次很多朋友说太难，所以这篇就写得很简单。主要在影片的属性的应用上做点探讨，先来看看效果吧!

    看完效果，大家应该有个印象吧，这是为我们闪式天下做的导航条，主要用缓冲效果，这方面的公式有

property = (target - property)/speed;

    常用的弹性缓冲效果还有：

x = disx-(disx-x)/a;y = disy-(disy-y)/a;//===============dx=dx*.a+(_root._xmouse-_x)*.b;dy=dy*.a+(_root._ymouse-_y)*.b;

    怎么推导这些公式，tuliping的教程做了很详细的推导，这里就不再赘述。

    下面我们来仔细看一看这个导航条，它里面变化主要有三个：

一、按钮的变化

    当鼠标放在按钮上时，一个mc的alpha值会从0增加到100，离开时，又从100减到0，实现的方法很简单，就下面这个函数

movieclip.prototype.mybutton=function(click){ if(click){this._alpha+=(100-this._alpha)/10; } else{this._alpha+=(0-this._alpha)/10; }}

    在这个函数里，其实只用了上面我们讲到的第一个缓冲公式，由一个布尔值来控制。

二、文字的变化

    当鼠标放在按钮上时，文字运动，并适当的增大，离开时，文字又恢复原状，控制这段运动的函数如下

MovieClip.prototype.move1=function(click,end_x,start_x){ if(click) {this._x+=(end_x-this._x)/2;  this._yscale+=(130-this._yscale)/2; } else {this._x+=(start_x-this._x)/2;  this._yscale+=(100-this._yscale)/2; }}

    这里，click也是一布尔值，end_x为运动的终点，start_x为运动的起点。

三、指针的变化

    指针随按钮可以旋转，并有一个缓冲的过程，这当然也用到缓冲公式，在这里，还牵涉到一丁点数学知识，就是怎么计算指针的角度，在场景中，有一个圆的影片，名为circle，指针的一端就放在圆心，当鼠标放在按钮上时，我们怎么计算角度呢？如图：

    已知C点和A点，怎么计算角a,从图中可以看出，三角形ABC是直角三角形。在flash中，有个函数Math.atan2(y, x)，它以弧度为单位计算并返回 y/x 的反正切值。返回值表示相对直角三角形对角的角，其中 x 是临边边长，而 y 是对边边长。所以我们只要求出AB，BC的值就可求出角a。在flash中，我们可以这样计算：

AB=A._y-c._y;

BC=a._x-c._x;

    我把它写在成一个函数

MovieClip.prototype.angle = function(x, y) {  var circle_x = circle._x;  var circle_y = circle._y;  var x = x-circle_x;  var y = y-circle_y;//计算临边和对边  var angle = Math.atan2(y, x)*180/Math.PI;//计算弧度并转换为角度  return (angle);//返回角度值};

    然后用缓冲公式写出指针的旋转函数

MovieClip.prototype.move = function() {   this._rotation += (ang-this._rotation)/3;};

    好了，准备工作基本完成，接下去我们来看看怎么使用上面这些函数，as如下：

onenterframe = function () {     line.move();line2.move();    c1.mybutton(click1);c2.mybutton(click2);    c3.mybutton(click3);c4.mybutton(click4);    text1.move1(click1,c1._x,550-text1._width+28);    text2.move1(click2,c2._x,550-text1._width+28);    text3.move1(click3,c3._x-text3._width+28,0);    text4.move1(click4,c4._x-text4._width+28,0);};

    在这里，line,line2为指针，c1,c2...为按钮上的红色mc,text1,text2为文字。

    最后就是用按钮来控制上面这些布尔值以及文字运动的位置

a1.onrollover = function() {  ang = angle(a1._x, a1._y);click1=1;  text1.b1="闪式动漫设计学堂";};a1.onrollout=function(){  click1=0;}a2.onrollover = function() { ang = angle(a2._x, a2._y); text2.b2="闪式脚本编程学堂"; click2=1};a2.onrollout=function(){  click2=0;}a3.onrollover = function() {  ang = angle(a3._x, a3._y);  text3.b3="D.SWF技术及其应用";  click3=1;};a3.onrollout=function(){  click3=0;}a4.onrollover = function() {  ang = angle(a4._x, a4._y);  text4.b4="作业及作品展示";  click4=1;};a4.onrollout=function(){  click4=0;}
//然后为按钮加上你要的链接for (var i = 1; i<5; i++) {  _root["a"+i].onrelease = function() {     getURL("http://www.mcmx.com");  };}

    以上这些as,可以进行精简，可参考我的上篇教程：详解导航动画的制作过程（闪客注），这就算给大家的作业吧!

    这个闪式天下的导航条是我们闪式天下所有人参与制作的，特别是beebee,封面的设计主要由他完成，做得非常漂亮。

注：tuliping的运动缓冲效果简析

http://www.mcmx.com/Announce/announce.asp?BoardID=100&ID=1581&Upflag=1&Num=1

透明按钮的制作(可看老何的鼠绘内幕电子书)

http://www.mcmx.com/Announce/Announce.asp?BoardID=101&ID=20

源文件下载

（完）