快速业务通道

Flash实例教程:制作水平缓动的导航菜单

作者 凌众技术 来源 网页制作 浏览 发布时间 2012-03-08

这一教程中,将学习如何创建一个水平菜单。

演示:


注意:为了完成这一效果,需要 TweenMax 类,这是一个实现缓效果的外部类,在名为gs的开源类库中。把附件中的gs类库文件解压到任意目录下,把新建的fla文件保存在同一目录下。

1、新建Flas***件,设置属性:宽、高 500 × 100 , 背景黑色。

2、选用基本矩形工具,画一个没有笔触的圆角长方形。边角半径为3, 颜色和大小任意。图1:
sshot-1.png
3、右键单击长方形,将长方形转换成影片剪辑。命名为 " Button Background " 设定注册点居中。图2:
sshot-2.png
4、在属性面板中输入影片剪辑的实例名称 " buttonBackground" 。图3:
sshot-3.png
5、图层1改名为 " button background " 。然后添加新的图层名为 " buttons "。

6、在 " buttons " 层中,在它里面创建一个静态的本文而且输入 "Home " 。图4:
sshot-4.png
7、将本文转换成影片。剪辑命名为 " Home button "  设定设定注册点居中。图5:
sshot-5.png
8、重复6、7步骤,创建另外三个按钮。输入文本为:" About button " , " Portfolio button " 和 " Contact button "。库如图6:
sshot-6.png
9、在舞台上水平地排列按钮。图7:
sshot-7.png
10、在属性面板中分别输入对应实例的名字 " homeButton" , " portfolioButton" , " aboutButton" 和 " contactButton"。

11、添加 AS 层输入代码:

//Import TweenMax

import gs.*;

import gs.plugins.*;

TweenPlugin.activate([BlurFilterPlugin]);



//Add the buttons into an array

var buttonsArray:Array = new Array(homeButton,portfolioButton,aboutButton,contactButton);



//Loop through the buttons array

for (var i:uint = 0; i < buttonsArray.length; i++) {



        //Add event listeners for the button

        buttonsArray[i].addEventListener(MouseEvent.MOUSE_OVER, mouseOverButton);

        buttonsArray[i].addEventListener(MouseEvent.CLICK, buttonClicked);

}



//

凌众科技专业提供服务器租用、服务器托管、企业邮局、虚拟主机等服务,公司网站:http://www.lingzhong.cn 为了给广大客户了解更多的技术信息,本技术文章收集来源于网络,凌众科技尊重文章作者的版权,如果有涉及你的版权有必要删除你的文章,请和我们联系。以上信息与文章正文是不可分割的一部分,如果您要转载本文章,请保留以上信息,谢谢!

分享到: 更多

Copyright ©1999-2011 厦门凌众科技有限公司 厦门优通互联科技开发有限公司 All rights reserved

地址(ADD):厦门软件园二期望海路63号701E(东南融通旁) 邮编(ZIP):361008

电话:0592-5908028 传真:0592-5908039 咨询信箱:web@lingzhong.cn 咨询OICQ:173723134

《中华人民共和国增值电信业务经营许可证》闽B2-20100024  ICP备案:闽ICP备05037997号