全Flash动画网站实现的基础教学

时间:2008-03-11 01:47:20  来源:经典论坛  作者:diamondian  【背景色 】

三：有关于按钮

其实flash站80%的功能都是基于鼠标事件来完成的，所以按钮在网站中的地位不言而喻，在我理解一个flash全站无非就是通过一些按钮的导向来播放不同位置的mc。按钮有两种方式可以实现。一种是按钮元件，一种是影片剪辑元件，这两个原件中。按钮只有4帧，而影片剪辑没有限制，所以如果需要一个有动画效果的按钮的时候，我们就只能用影片剪辑也就是mc来实现。事实上，我认为，mc在大部分时间里都可以替代按钮，通过脚本控制mc来实现按钮的功能要比按钮灵活的多。

这是一个最通常的动画按钮的内部结构：

新手提示：这里需要提示的是关于帧标签的概念：上图中时间轴里标注的s1与s2是帧标签，在帧的属性栏里可以输入，使用了帧标签可以用gotoAndPlay等等语句来播放该真标签所开始的位置，过了该帧标签的范围后，不会停止哦~~。用帧标签的好处是你无需理会关键桢的数值，在任何地方播放这段动画，都可以含义明了的操作，并且容易解读和记忆。

在这个按钮mc所在的帧上（上图的外层）写上如下脚本，这个按钮就生效了。

btn1.onRollOver=function(){btn1.gotoAndPlay"s1"};
btn1.onRollOut=function(){btn1.gotoAndPlay"s2"};
btn1.onRelease=function(){};

可以看出在用脚本对btn1按钮添加了onRollOver，onRollOut，onRelease事件后，也就是经过，离开，点击，这个mc就拥有了一个按钮的3种状态，至于点击并不松手这种状态，通常并不常用，所以就没有添加，如果需要的话，那么只需要在对应的帧上写onPress事件就可以了

需要注意的是：利用这样的写法来实现的按钮，时间轴不能过长，也就是说，动作效果不能动画太长，如果时间很长的话，当你的鼠标划过的时候，这个按钮会执行s2部分，而这么长的动画，你并不是想要播放的，这个按钮已经可以说是一段用鼠标事件激活的动画了，不该用鼠标经过这样的事件来激活。

在全站中经常有这样的情况，即是很多按钮都要实现类似或者同一种类的功能，那么一一写onRollOver等等就太烦琐了。

这时候我们就需要用循环的功能了，最开始，如果你看不懂，那么你并不需要去深究到底是怎么写法，粘贴过去，然后去改你需要改的部分吧。

这里有5个按钮，按钮的名字是pm1，pm2---pm5,当鼠标经过这些mc的时候，如果经过的不是已经点过的mc的话，就播放这个mc的“s1”部分，鼠标离开的时候，满足同样条件就播放“s2”部分，点击这个mc的话，上一个被点的mc播放"s2"部分（通常也就是回到初始的状态）。

stop();
function rollover() {
    if (_root.a != this.indexNum) {
        this.gotoAndPlay("s1");
    }
}
function rollout() {
    if (_root.a != this.indexNum) {
        this.gotoAndPlay("s2");
    }
}
function release() {
    this._parent["pm"+_root.a].gotoAndPlay("s2");//上一个被点的按钮执行播放s2
    _root.a = this.indexNum;
               //上面的代码顺序不能错。代码执行也是有顺序的，
               //点击后需要做的事情写在这里。
}
for (var i:Number = 1; i<6; i++) {
    this["pm"+i].onRollOver = rollover;
    this["pm"+i].onRollOut = rollout;
    this["pm"+i].onRelease = release;
    this["pm"+i].indexNum = i;
}