flash教材配套PPT第10章-网站Flash导航条制作

1Part10第10章网站Flash导航条制作2目标概述案例效果学习目标

网站导航条一般分为图像式导航条和动画式导航条两种，图像式导航条指利用图像设置链接而成，这种导航条用户可以直接在Dreamweaver中制作；动画式导航条指使用具有交互功能的动画作为导航对象，这种导航条就需要在Flash中制作。动画式导航条因效果绚丽应用的越来越多，本项目就是为常州工程职业技术学院学院网站制作导航条。项目完成的效果如图设计思路10.14本项目将利用Flash软件，制作用于常州工程职业技术学院网站上的导航条动画。该导航条的制作思路如下：1.动画的初始状态显示一级菜单，如图所示效果；2.当浏览者将光标移到一级导航条按钮上，该按钮会有黄色矩形背景闪烁，并从按钮下方弹出该按钮的二级菜单，如图所示；3.当光标移到其他按钮上，那么原来按钮的二级菜单就会消失，而光标所在按钮的二级菜单将从下方弹出，如图所示。导航条初始状态5光标移到按钮的状态光标移到其他按钮的状态项目实施10.27任务说明制作导航条按钮，实现导航条初始效果（1）制作导航条按钮（2）制作按钮动画影片剪辑，实现背景闪烁效果效果展示任务1制作导航条按钮初始动画效果8任务2制作光标移到按钮状态的动画效果任务说明实现光标移到按钮上的动画效果。（1）制作按钮的二级菜单；（2）制作二级菜单向上移动动画；效果展示9任务3制作鼠标移到其他按钮的动画效果任务说明实现鼠标移到其他按钮的动画效果。（1）为按钮添加行为；（2）设置二级菜单的链接。效果展示经验指导10.311相关知识1.导航菜单制作说明导航菜单是网页元素中非常重要的部分，其主要作用就好像是网站内容的目录，通过导航菜单可以让用户在浏览网页时很容易地到达不同的页面。其次导航栏还提供了链接的关键字。通过导航栏可以让用户清晰地找到要浏览的网站内容。12相关知识2.导航菜单设计技术概述

根据不同的需要，可以使用多种技术来进行导航菜单的制作。

1.使用HTML制作简单的图片和文字链接式导航菜单简单的文字获图片导航，只使用HTML代码就可以了。这种导航菜单只是网站主要页面的文字或图片链接的堆积，实用性较强，下载速度快，但视觉效果差。

图片和文字导航菜单132.导航菜单设计技术概述

2.使用脚本和样式表制作的导航菜单

在HTML网页中，使用脚本代码（如JavaScript）和样式表（CSS）可以做出不错的导航菜单效果。菜单项不再只是堆积在一起的链接，而是将其分类，当鼠标移动到相应位置，会显示该栏目的子类，菜单的互动效果也较好。使用脚本和样式表制作的动态导航菜单相关知识14拓展训练

3.使用Flash制作的动感导航菜单

Flash由于具有独特的多媒体交互方式。可以制作出视觉与互动效果极佳的导航菜单，这是其他方法无法做到的。

视觉与互动效果极佳的Flash导航菜单由于Flash在制作动感导航菜单上具有得天独厚的优势，使用按钮元件和影片剪辑元件可以很容易地实现视觉效果极佳的交互式导航菜单，即使是传统的HTML静态网站，也有很多采用Flash来制作导航菜单部分的内容。15相关知识3.

影片与网页的加载和卸载

导航菜单的用途是快速第定位到浏览的页面，这就需要用到影片或网页的调用函数来加载浏览的影片或页面。在影片中，如果加载的影片过多，则会大量占用系统资源，对于不再使用的影片。可以通过卸载命令，将加载的影片进行卸载，释放其所占用的资源。用于影片与网页的加载和卸载的函数包括loadMovieloadMovieNum()getURL()unloadMovie()unloadMovieNum()

16相关知识1.影片与网页的加载

loadMovie()、loadMovieNum()和getURL()函数课用于影片或网页的加载。（1）loadMovie()函数loadMovie()函数用来从当前动画的外部加载影片或图像到指定的位置。（2）loadMovieNum()函数loadMovieNum()函数与loadMovie()函数功能相似，用于从当前播放的动画外部，加载SWF动画到指定的位置。（3）getURL()函数getURL()函数用于调用网页或邮件。17相关知识

2.影片的卸载（1）unloadMovie()函数unloadMovie()函数用于删除通过loadMovie()加载的影片或图像。（2）unloadMovieNum()函数unloadMovieNum()函数用于删除通过loadMovieNum()加载的影片。拓展训练10.419制作商业网站导航条项目说明项目名称商业网站导航条色彩清新，设计样式活，添加flash动态效果使导航条更加有活力。设计提示（1）应用矩形工具设计背景；（2）制作菜单按钮；（3）应用移动工具设置光标放在按钮上按钮移动少许；（4）添加脚本语言实现动画效果效果展示1.制