项目十　综　合　实　战

项目引入

由于Flash动画具有容量小，交互性强，速度快，支持声音、视频多媒体元素等特性，所以Flash动画在网络与移动领域得到了广泛应用，如Flash广告、Flash课件、Flash小游戏等。本项目将以制作Flash贺卡、Flash手机屏保、Flash广告和Flash网站这几个主流的Flash应用为主题，将前面学习的知识点进行综合应用。

任务一　制作Flash贺卡

随着网络的普及，Flash贺卡作为一种全新的问候形式越来越被人们所热衷，与传统贺卡相比，Flash贺卡互动性更强、表现形式更多样化，已经成为朋友之间传递祝福的一种新时尚。

Flash贺卡丰富多彩，种类齐全，有生日贺卡、节日贺卡、问候贺卡、爱情贺卡等。在一个特定的日子里收到远方的祝福，可以更好地表达亲情和友情。

任务目标：制作一份友情贺卡，贺卡动画由几幅美丽的图像衬托它的意境，再配以优美的音乐和文字，以表达对远方朋友的思念，贺卡页面效果如图10-1所示。

具体操作步骤如下。

(1) 启动Flash CS5程序，按【Ctrl+N】键新建一个Flash文档，设置舞台大小为“440×330”像素、背景颜色为“黑色”、帧频率为“24.00”fps。

(2) 导入图片素材“背景图1.jpg”、“背景图2.jpg”、“背景图3.jpg”，然后将舞台中所有的内容全部选中，单击菜单栏中的【修改】|【时间轴】|【分散到图层】命令，将导入的3张图片分别插入不同图层，如图10-2所示。

(3) 分别将“背景图1.jpg”、“背景图2.jpg”、“背景图3.jpg”转换成名称为“背景1”、“背景2”、“背景3”的图形元件。

(4) 将“图层1”图层重命名为“黑色镂空”，然后在此图层绘制一个中间镂空的黑色矩形，矩形大小设置为“1200×1000”像素，镂空宽度与舞台同宽，高度比舞台略窄，设置为“440×280”像素，如图10-3所示。

注意：绘制黑色镂空矩形的目的是遮挡住舞台区域外的内容。因为Flash动画在FlashPlayer播放器中播放时，如果拉伸播放器窗口，则会看到舞台区域外的内容，所以可以在动画最上层覆盖一个黑色的图形将舞台外区域遮挡住，使动画画面看起来更加协调。这也是制作Flash动画时使用的一种技巧，尤其在Flash贺卡、MTV动画中应用比较广泛。

(5) 选择所有图层第1300帧，按【F5】键为所有图层第1300帧插入帧，设置动画播放时间为1300帧。

(6) 显示标尺，拖出4条参考线标注舞台大小。

(7) 将图层“黑色镂空”、“背景图3.jpg”、“背景图2.jpg”设为不可见，选中舞台中的“背景1”图形元件，调整其在舞台的位置，如图10-4所示。然后在第460帧处插入关键帧，缩小“背景1”图形元件并调整其位置，在两个关键帧之间任意选一帧创建传统补间，如图10-5所示。

(8) 设置“背景图1.jpg”图层为不可见、“背景图2.jpg”图层为可见，将“背景图2.jpg”图层第1帧拖动到第400帧处，调整此处“背景2.jpg”图形元件的位置，将其上半部分覆盖住舞台，如图10-6所示。

(9) 在“背景图2.jpg”图层第860帧处插入关键帧，将“背景2”图形元件向上垂直移动一段距离，在2个关键帧之间任意选一帧创建传统补间，如图10-7所示。

(10) 在“背景图2.jpg”图层第460帧处插入关键帧，选中第400帧，在【属性】面板中设置“背景2”图形元件的Alpha值为“0”。

(11) 按照“背景图2.jpg”图层制作动画的方法，在“背景图3.jpg”图层中创建“背景3”图形元件并逐渐显示由下向上移动的传统补间动画。“背景图3.jpg”图层各个关键帧的图像位置如图10-8至图10-10所示。

(12) 在“背景图3.jpg”图层上创建新图层“文字1”，在舞台左上方输入文字“回忆”，字号设置为“30”，颜色设置为“#A80000”，并将文字转换成名为“文字1”的图形元件，如图10-11所示。

(13) 在“文字1”图层第120帧、第400帧、第440帧处分别插入关键帧，然后将第1帧处的“文字1”图形元件向右拖动一段距离，设置第1帧处“文字1”图形元件的Alpha值为“0”，并在第1帧和第120帧之间创建传统补间。

(14) 在“文字1”图层上新建图层“文字2”，在“文字2”图层第120帧处插入关键帧，在舞台左侧输入文字“那些在一起的时光”，在【属性】面板中设置文字“那些在一起的”字号为“22”、颜色为“黑色”，设置文字“时光”字号为“30”、颜色为“#A80000”，设置整行文字基准基线为“下缘”，并将文字转换成名为“文字2”的图形元件，如图10-12所示。

(15) 在“文字2”图层第240帧、第400帧、第440帧处分别插入关键帧，然后将第120帧处的“文字2”图形元件向左拖动一段距离，设置第120帧处“文字2”图形元件的Alpha值为“0”，并在第120帧和第240帧之间创建传统补间。

(16) 在“文字2”图层上新建图层“文字3”，在“文字3”图层第240帧处插入关键帧，在舞台左侧输入文字“是记忆里最美的画面”，在【属性】面板中设置文字“是记忆里最”和“的”字号为“22”、颜色为“黑色”，设置文字“美”和“画面”字号为“30”、颜色为“#A80000”，设置整行文字基准基线为“下缘”，并将文字转换成名为“文字3”的图形元件，如图10-13所示。

(17) 在“文字3”图层第360帧、第400帧、第440帧处分别插入关键帧，然后将第240帧处的“文字2”图形元件向右拖动一段距离，设置第240帧处“文字3”图形元件的Alpha值为“0”，并在第240帧和第360帧之间创建传统补间。

(18) 在图层“文字1”、“文字2”、“文字3”第440帧处分别将3个文字图形元件的Alpha值设置为“0”，在这3个图层的第400帧和第440帧之间创建传统补间，制作文字消失的效果，如图10-14所示。

(19) 在“文字3”图层上新建图层“文字4”、“文字5”，用前面所介绍的方式制作“思念”、“是淡淡的诗”的文字动画效果，如图10-15所示。

(20) 在“文字5”图层上新建图层“文字6”、“文字7”，用前面所介绍的方式制作“相信总有一天”、“我们会再度重逢”的文字动画效果，如图10-16所示。

(21) 在“黑色镂空”图层上新建图层“背景音乐”，在“背景音乐”图层第1帧导入声音文件“背景音乐.mp3”，并在【属性】面板中设置“同步”参数为“开始”，如图10-17所示。

(22) 在“黑色镂空”图层上新建图层“按钮”，在第1200帧处插入关键帧，在舞台右下方输入白色文字“Replay”，并将其转换成名为“replay”按钮元件，在【属性】面板中设置实例名称为“go_replay”，如图10-18所示。

(23) 双击【replay】按钮，设置鼠标悬停状态时【replay】按钮比弹起状态时略大。

(24) 在“按钮”图层第1248帧处插入关键帧，设置第1200帧处【replay】按钮的Alpha值为“0”，在第1200帧和第1248帧之间任意选一帧创建传统补间，如图10-19所示。

(25) 新建图层“AS”，在第1248帧处插入关键帧，在【动作】面板中输入如下动作脚本：

(26) 为了避免动画中画面移动时出现的抖动，打开【库】面板，分别双击3张背景图片“背景图1.jpg”、“背景图2.jpg”、“背景图3.jpg”，在弹出的【位图属性】对话框中勾选“允许平滑”属性，如图10-20所示。

(27) 按【Ctrl+S】键保存文档，然后按【Ctrl+Enter】键对动画进行测试。

任务二　制作Flash手机屏保

Flash技术最早兴起在个人计算机上，由于当时的手机功能比较单一，而且从屏幕颜色、处理速度、压缩技术等方面都不能实现手机对Flash的支持。但随着手机技术和Flash技术的进步，这种可能成为现实。Flash CS5中集成移动版的Flash播放器——Flash Lite提供了对移动设备的支持。

使用Flash提供的Flash Lite播放器可以实现很多手机的增值应用，包括Flash手机屏保、Flash手机主题、Flash手机游戏等。随着手机厂商对Flash Lite播放器的逐渐支持，以及Flash Lite播放器版本的不断提升，Flash在手机方面的应用将会越来越广。

任务目标：制作一个简单的Flash屏保动画，画面中有气泡缓缓飘过，并能显示当前的时间日期，效果如图10-21所示。

具体操作步骤如下。

(1) 启动Flash CS5程序，按【Ctrl+N】键选择“Flash Lite 4”，此时会创建一个舞台大小为“240×320”像素、背景为“白色”的Flash文档，如图10-22所示。

(2) 单击菜单栏中的【文件】|【发布设置】命令，弹出【发布设置】对话框，在其中选择“Flash”选项卡，在“播放器”和“脚本”下拉框中选择要使用的版本，如图10-23所示。目前最高的Flash Lite播放器版本为4.0，其支持的动作脚本为ActionScript 3.0，也只有Flash Lite 4.0版本才支持ActionScript 3.0。如果使用Flash Lite 3.1以下版本的播放器，则只能使用ActionScript 2.0脚本。结合日后的技术发展趋势，这里使用Flash Lite 4.0版本及ActionScript 3.0脚本来制作本实例。

(3) 将“图层1”重命名为“背景”，导入图片素材“屏保背景.jpg”，设置图片与舞台大小重合，如图10-24所示。

(4) 新建图层“透明框”，导入图片素材“透明.png”到库，从库中拖动2份素材到舞台，分别放置在舞台上端和下端，制作半透明遮挡效果，稍后制作的时间、日期文字提示就显示在透明遮挡框处，其中下方的文字较小，因此将下方的半透明素材往下拖出舞台一些，如图10-25所示。

(5) 新建图层“文本框”，选择文本工具，在【属性】面板中设置文本引擎为“传统文本”、文本类型为“动态文本”、字体为“Comic Sans MS”、字体大小为“26.0点”、字体颜色为“白色”，再通过按钮嵌入字体，然后使用文本工具在舞台上方拖曳出一个文本框，并将文本框的“实例名称”设置为“time_text”，用于显示时间信息，如图10-26所示。

(6) 使用同样的方法将文本“大小”设置为“16”，在舞台下方的透明框中间拖曳出一个文本框，并将“实例名称”设置为“date_text”，用于显示日期信息。

(7) 接下来设计飘动的气泡。为了制作气泡满屏且方向没有规律的效果，这里使用引导层制作3个气泡的运动轨迹。新建图层“气泡1”，导入图片素材“气泡.png”，将其转换成名为“气泡1”的影片剪辑元件。

(8) 双击进入“气泡1”元件的编辑窗口，右键单击图层，选择【添加传统运动引导层】命令，绘制引导线，在引导层第240帧处插入帧，在“图层1”第240帧处插入关键帧，在第1帧和第240帧之间添加传统补间动画，在“图层1”第1帧和第240帧处将气泡对齐到路径。在第50帧和第190帧处分别插入关键帧，设置第1帧和第240帧处“气泡”元件Alpha值为“0”，如图10-27所示。

(9) 新建图层“气泡2”、“气泡3”，分别创建影片剪辑元件“气泡2”、“气泡3”，使用同样的方式制作两个不同运动轨迹的气泡动画，如图10-28所示。

(10) 在所有图层的第50帧处插入帧，如图10-29所示。

(11) 打开【库】面板，在影片剪辑元件“气泡1”处单击鼠标右键，在弹出菜单中选择【属性】命令，弹出【元件属性】对话框，在此对话框中将“高级”展开，在其中“类”输入框中输入“bubble1”，如图10-30所示。

(12) 使用同样的方式将影片剪辑元件“气泡2”、“气泡3”的类名设置为“bubble2”和“bubble3”，如图10-31所示。

(13) 新建“AS”图层，在图层“AS”第50帧处插入关键帧，在【动作】面板中设置动作脚本为“stop();”。

(14) 选择图层“AS”第1帧，打开【动作】面板，输入如下动作脚本：

上述代码分别以影片剪辑元件“气泡1”、“气泡2”、“气泡3”为原型，取随机值生成不同大小和位置的气泡沿着3条不同的运动轨迹运动。

(15) 还是在图层“AS”第1帧的【动作】面板中接着输入如下代码：

上述代码将日期信息显示在实例名称为“date_text”的文本框内，将时间信息显示在实例名称为“time_text”的文本框内。

(16) 按【Ctrl+S】键保存文档，然后按【Ctrl+Enter】键对动画进行测试。

任务三　制作Flash广告

Flash广告与其他广告相比具有很好的视觉冲击力，它能够将整体节奏控制得恰到好处，让人过目不忘。此外，Flash还具有交互性的优势，这与网络的开放性有着密切的关系。商品采用Flash广告既能满足受众的需要，还能让受众参与其中，通过单击、选择等动作决定动画的运行过程和结束，使广告信息的传达更加人性化，更具趣味性。

使用Flash制作广告，能够将完美的创意及生动幽默的动画效果、视觉表现手法和声音有效地融合在一起，不仅弥补了传统广告中画面设计单一的不足，而且给人留下了深刻的印象。由于Flash制作成本少、周期短，制作效果引人入胜，越来越多的公司开始用它来制作广告。

任务目标：制作“2012沙宣秋冬凝动造型系列”的宣传广告，页面动画效果如图10-32所示。

具体操作步骤如下。

(1) 启动Flash CS5程序，按【Ctrl+N】键新建一个Flash文档，设置舞台大小为“420×435”像素、背景颜色为 “白色”、帧频率为“24.00”fps。

(2) 将“图层1”重命名为“背景”，选择基本矩形工具，在【属性】面板中设置“填充颜色”为“白色”到“棕色”的径向渐变，绘制大小为“420×435”像素的矩形，拖动矩形与舞台重合，并使用渐变变形工具调整径向渐变的圆心位置及渐变范围，如图10-33所示。

(3) 新建图层“LOGO”，导入图片素材“logo.png”，拖动到舞台左上角，并在图层“背景”和“LOGO”第200帧处插入帧，效果如图10-34所示。

(4) 新建图层“黑色镂空”，在此图层上绘制一个中间镂空的黑色矩形，矩形大小为“1200×1000”像素，镂空大小与舞台相同，如图10-35所示。

(5) 制作第一个动画页面中的元素。在图层“LOGO”上方新建图层“P1人物右”、“P1人物左”、“P1人物中”，分别向这3个图层导入图片素材“人物1.png”、“人物2.png”、“人物3.png”，并将这3张图片转换成影片剪辑元件“P1人物右”、“P1人物左”、“P1人物中”，调整元件初始位置，如图10-36所示。

(6) 在图层“P1人物中”第15帧处插入关键帧，设置该处元件的大小位置，如图10-37所示。选择第1帧，将该处元件Alpha值设置为“0”，在两个关键帧之间任意选一帧创建传统补间。

(7) 将图层“P1人物左”第1帧拖曳到第10帧，在第20帧处插入关键帧，设置该处元件的大小、位置，如图10-38所示。选择第10帧，将该处元件Alpha值设置为“0”，在两个关键帧之间任意选一帧创建传统补间。

(8) 将图层“P1人物右”第1帧拖曳到第10帧，在第20帧处插入关键帧，设置该处元件的大小、位置，如图10-39所示。选择第10帧，将该处元件Alpha值设置为“0”，在两个关键帧之间任意选一帧创建传统补间。

(9) 在图层“P1人物右”上方新建图层“文字1”，选择文本工具，在【属性】面板中设置字体为“Swis721 Lt BT”、字号为“62”、颜色为“黑色”，在舞台中输入文字“MO”， 然后将文字“O”设置为“红色”。在图层“P1人物中”上方新建图层“文字2”，输入文字“VEABLE”，将两个文本链接放置摆成一个单词，并将两个文字分别转换成名为“P1文字1”和“P1文字2”的影片剪辑元件，如图10-40所示。

(10) 在图层“文字2”上方新建图层“文字3”，设置文字字号为“60”，输入文字“SHAPE”，其中文字“P”设置为“红色”，并将文字转换成名为“P1文字3”的影片剪辑元件，如图10-41所示。

(11) 将图层“文字1”和“文字2”的第1帧拖动到第10帧，在第25帧处插入关键帧，在第10帧处同时选中元件“P1文字1”和“P1文字2”，将它们拖出舞台外，如图10-42所示。在第10帧和第25帧之间任意选一帧创建传统补间。

(12) 将图层“文字3”第1帧拖曳至第15帧，在第26帧处插入关键帧，选择第15帧，将该处元件右移至舞台外，在第15帧和第26帧之间任意选一帧创建传统补间。

(13) 在图层“P1人物右”、“P1人物左”、“P1人物中”第65帧和第70帧处分别插入关键帧，在第70帧处为3个图层中的元件添加“模糊”滤镜，“模糊X”和“模糊Y”都设置为“5”像素，“品质”设置为“高”，如图10-43所示。

(14) 在3个人物图层第78帧处插入关键帧，将元件“P1人物左”和“P1人物中”拖动至舞台左侧外，将元件“P1人物右”拖动至舞台右侧外，分别在3个图层的第65帧和第70帧之间、第70帧和第78帧之间创建传统补间，如图10-44所示。

(15) 在图层“文字1”、“文字2”、“文字3”第74帧和第85帧处分别插入关键帧，在第85帧处选中3个文字元件，将它们一起拖动至舞台右侧外，分别在3个图层第74帧和第85帧之间添加传统补间，如图10-45所示。

至此广告动画的第一个动画页面效果就全部完成了，第二个动画页面的制作方式与前面所介绍的内容类似，这里简略介绍制作过程。

(16) 在图层“文字3”上方新建图层“P2人物大”、“P2人物小”、“文字1”、“文字2”、“文字3”、“文字4”和“箭头”。分别在这些图层第100帧处插入关键帧，导入图片素材、输入文字及绘制图形，并分别把这些元素转换成影片剪辑元件，如图10-46所示。其中“箭头”影片剪辑元件、内部图层结构如图10-47所示。

(17) 在这个动画页面的元素进入阶段，2个人物元件采用“模糊”滤镜及Alpha值变化的方式进入，4个文字元件及箭头采用从舞台两端移动的方式进入，时间轴如图10-48所示。

(18) 从第165帧开始进入各个元素退出阶段，退出效果与进入效果一致，2个人物元件采用“模糊”滤镜及Alpha值变化的方式退出，4个文字元件及箭头采用从舞台两端移动的方式退出，时间轴如图10-49所示。

(19) 至此，整个Flash广告动画制作完成，按【Ctrl+S】键保存文档，然后按【Ctrl+Enter】键对动画进行测试。

任务四　制作Flash网站

人们在创建网站时会依据不同的目的创建不同类型的网站。不同类型的网站具有不同的作用，针对不同的网站也会有不同的用户群。如个人可以依据自己的爱好，创建展现自己个性的网站；企业会为了展示企业形象及让用户了解企业，在互联网上创建企业自己的网站……按照网页应用的类型，通常可以将网站划分为电子商务网站、门户网站、娱乐网站、教育网站、政务网站等几大类型。

任务目标：本任务将制作一个时尚品牌的网站。网站色调鲜艳动感，包含1个登录页面及4个栏目页面，如图10-50所示。

具体操作步骤如下。

(1) 启动Flash CS5程序，按【Ctrl+N】键新建一个Flash文档，设置舞台大小为“750×600”像素、背景颜色为灰色“#D4D4D4”、帧频率为“24.00”fps。由于背景颜色与Flash工作区域颜色一样，建议打开标尺拖出参考线做标识。

(2) 首先制作登录页面效果。将“图层1”重命名为“背景”图层，使用基本矩形工具绘制一个大小为“650×500”像素的白色圆角矩形放置在舞台正中，再绘制同等大小的颜色为灰色“#A1A1A1”的圆角矩形并放置在白色圆角矩形右下方6像素处，将灰色圆角矩形调整到白色圆角矩形下层，做出阴影效果，如图10-51所示。

(3) 新建图层“鞋”，导入图片素材“鞋.png”，将图片素材放置在白色圆角矩形左下角。新建图层“FASHION”，输入大写英文“FASHION”，并在下方绘制一条线段，将两者转换成名为“FASHION”的影片剪辑元件。新建图层“brand”，在文字“FASHION”上方输入小写英文“brand”，并转换成名为“brand”的影片剪辑元件。新建图层“左侧标题”，导入图片素材“ico.png”，分别输入3行文字“FRESH STYLE”、“NEW FASHION TENOENCY”和“ENQUISITE TASTE”，将文字与ICO图标一起转换成名为“左侧标题”的影片剪辑元件。新建图层“底部文字”，在舞台右下方输入文字“Copyright @ Fashion Brand. All rights reserved.”，并在其上方绘制一条线段，将两者转换成名为“底部文字”的影片剪辑元件，如图10-52所示。

(4) 在图层“背景”、“FASHION”、“brand”、“左侧标题”和“底部文字”第140帧处插入帧，在图层“鞋”第72帧处插入帧。

(5) 为这些元素添加动态效果。在图层“鞋”上方新建图层“遮罩1”，在图层“遮罩1”第1帧处绘制一个小三角形，三角形放置在白色圆角矩形左下角之外，在第10帧处插入关键帧，使用任意变形工具拉伸三角形，直至完全遮挡住图层“鞋”的画面，在第1帧与第10帧之间创建补间形状，将图层“遮罩1”转换成遮罩层，如图10-53所示。

(6) 将图层“FASHION”第1帧拖动到第10帧，在图层“FASHION”上方新建图层“遮罩2”，在图层“遮罩2”第10帧处插入关键帧，在文字“FASHION”左侧绘制一个很窄的矩形，在图层“遮罩2”第20帧处插入关键帧，使用任意变形工具拉伸矩形，直至完全遮挡住图层“FASHION”的画面，在第10帧与第20帧之间创建补间形状，将图层“遮罩2”转换成遮罩层，如图10-54所示。

(7) 将图层“brand”第1帧拖动到第20帧，在图层“brand”第30帧处插入关键帧，设置第20帧处“brand”元件的Alpha属性为“30%”，并向右拖曳一段距离，在第20帧与第30帧之间创建传统补间。

(8) 将图层“左侧标题”第1帧拖动到第25帧，在图层“左侧标题”第35帧处插入关键帧，设置第25帧处“左侧标题”元件的Alpha属性为“0”，在第25帧与第35帧之间创建传统补间。

(9) 将图层“底部文字”第1帧拖动到第30帧，在图层“底部文字”第40帧处插入关键帧，设置第30帧处“底部文字”元件的Alpha属性为“0”，并向下拖动一段距离，在第30帧与第40帧之间创建传统补间，如图10-55所示。

(10) 在图层“底部文字”上方新建图层“黄”、“红”、“蓝”和“Enter”。分别在图层“黄”第40帧、图层“红”第43帧、图层“蓝”第46帧处插入关键帧，分别绘制黄色、红色、蓝色的圆角矩形，并转换成名为“黄”、“红”、“蓝”的影片剪辑元件，在图层“Enter”第49帧处插入关键帧，绘制黑框的圆角矩形，输入文字“Enter”，转换成名为“Enter”的按钮元件，设置其实例名称为“enterbutton”，如图10-56所示。

(11) 分别在图层“黄”第46帧、第66帧、第72帧，图层“红”第49帧、第63帧、第69帧，图层“蓝”第52帧、第60帧、第66帧，图层“Enter”第55帧、第56帧、第57帧、第63帧处插入关键帧。

(12) 分别设置图层“黄”第46帧、第72帧处元件Alpha值为“0”， 图层“红”第43帧、第69帧处元件Alpha值为“0”， 图层“蓝”第46帧、第66帧处元件Alpha值为“0”， 图层“Enter”第49帧、第63帧处元件Alpha值为“0”，并添加传统补间，制作4个圆角矩形框显示及消失的效果，如图10-57所示。

(13) 在图层“遮罩1”第62帧和第72帧处插入关键帧，使用任意变形工具将第72帧处三角形缩小至完全无法挡住图层“鞋”的画面，制作图片“鞋”消失的效果。至此，登录页面中各元素的动画效果全部完成。

(14) 在打开栏目页面的过程中将出现一些新元素。在图层“Enter”上方新建图形“包”，导入图片素材“包.png”，在图层“包”第73帧处插入关键帧，将图片放置在左下角，使用设置图层“鞋”同样的方式，添加遮罩层制作展开效果，如图10-58所示。

(15) 在图层“遮罩3”上方新建图层“按钮home”、“按钮about”、“按钮fashion”、“按钮contacts”，分别在图层“按钮home”第73帧、“按钮about”第76帧、“按钮fashion”第79帧、“按钮contacts”第82帧处插入关键帧，绘制4个圆角矩形，并将其转换成名为“bhome”、“babout”、“bfashion”、“bcontacts”的按钮元件，设置4个按钮的鼠标悬停属性，将它们的实例名称分别设置为“homebutton”、“aboutbutton”、“fashionbutton”、“contactsbutton”。

(16) 在图层“按钮home”、“按钮about”、“按钮fashion”、“按钮contacts”中分别添加一段传统补间，制作按钮出现的动画效果，如图10-59所示。

(17) 到这里，4个栏目页的共有部分全部完成。下面制作“HOME PAGE”栏目页，新建图层“文字”、“图片”、“线条”，分别在这3个图层第90帧处插入关键帧，添加文字、图片及点画线内容，如图10-60所示。

(18) 新建图层“遮罩4”，使用与前面所述类似的方式，制作由第90帧到第100帧的遮罩层动画，效果为图层“文字”、“图片”、“线条”中的内容由上至下展开，如图10-61所示。

(19) 按照制作“HOME PAGE”栏目的方法，分别制作“ABOUT US”、“FASHION”、“CONTACTS”栏目页。这里为了节省篇幅，直接用页面截图来代替文字、图片和线条的内容。完成后的“ABOUT US”、“FASHION”、“CONTACTS”栏目页如图10-62所示。

(20) 至此，页面的内容部分全部完成，接下来通过ActionScript动作命令将各个栏目串联起来，通过单击按钮进行连接。新建图层“帧标签”，在该层第73帧、第90帧、第101帧、第111帧、第121帧处插入关键帧，然后依次设置第1帧、第73帧、第90帧、第101帧、第111帧、第121帧的标签名称为“index”、“栏目”、“home”、“about”、“fashion”和“contacts”，如图10-63所示。

(21) 在图层“帧标签”上方新建图层“AS”，分别在图层“AS”第55帧、第90帧、第100帧、第101帧、第110帧、第111帧、第120帧、第121帧、第130帧处插入空白关键帧。

(22) 分别选择图层“AS” 第100帧、第110帧、第120帧、第130帧，在【动作】面板中设置动作脚本为“stop();”，设置动画播放到这些帧时停止播放。

(23) 选择图层“AS”第55帧，在【动作】面板中输入如下动作脚本：

(24) 选择图层“AS”第90帧，在【动作】面板中输入如下动作脚本：

(25) 选择图层“AS”第101帧，在【动作】面板中输入如下动作脚本：

(26) 选择图层“AS”第111帧，在【动作】面板中输入如下动作脚本：

(27) 选择图层“AS”第121帧，在【动作】面板中输入如下动作脚本：

(28) 按【Ctrl+S】键保存文档，然后按【Ctrl+Enter】键对动画进行测试。