图3-8页中导航栏
图3-9所示为一个随屏幕移动的信息栏,超链接是导向到南国桃园官方网站。这个版面功能是通过Javascript实现的。
b.图片演示部分版面介绍
图片演示页有两种形式,一种网络相册的形式,另外一种
是flash制作成的幻灯片效果,如图3-10。都可以通过点击 图3-9 联系信息栏 查看大图。
图3-10 图片演示集
- 9 -
3.2 功能实现和技术研究 3.2.1下拉菜单的实现
a.操作过程
打开操作文 件 制作影片剪辑元件 编辑影片剪辑元件 输入实 例名
完成动画 测试动画
图3-11 下拉菜单实现操作过程图 b. 两个简单的按钮类脚本分析
On (rollover){
_root.Menu.gotoAndPlay(“1 Down”); }
//当鼠标滑过按钮上方时,运行实例名为Menu的影片剪辑中标签为1 Down的帧。
On ( roolover) {
_root.Menu.gotoAndPlay(“3 Down”); }
//在main3影片剪辑元件的编辑画面中输入透明按钮的动作脚本。
上面列出的是影片剪辑元件的一些简单编辑过程。Flash代码与一般的asp代码有很多的相似之处。而不同的是Flash更侧重于图像,代码脚本只需在必要时应用上就足够了。上面看到的1Dow帧是控制当鼠标滑过时,显示某个下来菜单的一条命令,而第二个脚本作用是给main3这个下拉菜单的某个项目添加一个透明的按钮。在Flash中,按钮是引导下一个动作的功能键,添加上按钮给这个菜单赋予了比一般图形剪辑更多的功能。
c. 设计技术要点
这里应用简单的动作和标签名来制作这种效果,因此脚本程序比较长,用于导航的
影片剪辑的编辑过程都较为复杂。因为在影片剪辑中使用了多个影片剪辑,并在每个影片剪辑中又包含其它编辑过程,所以容易混淆的部分比较多。制作剪辑是一个复杂的过
- 10 -
程,而通过放置透明按钮实现鼠标滑过时引发事件,实现子菜单的弹出隐藏是这个实例的关键之处。
3.2.2图片集的幻灯片切换技术 a. 操作过程
制作影片剪辑元件 制作mask_mcs影片剪辑元件 制作nemo_mc影片剪辑元件 制作nemo图形元件 制作mask_mcs影片剪辑元件 编辑nemo_mc影片剪辑元件 应用遮罩 测试动画
图3-12 图片集实现操作过程图
b.设计技术要点
本实例是应用遮罩功能实现的图片切换效果,设计过程中需要制作多个影片剪辑元件,而且需要对同一个元件运用多重遮罩,反复的操作容易造成混淆,因此元件的命名需要科学和有条理。比如两个图片间的切换就需要一个包含两个影片剪辑元件和一个图形元件的影片剪辑元件,即4个元件。7个图片间的切换就需要24个元件了。另外,flash中的遮罩功能十分强大,应用不同的遮罩形式就能完成各种变化效果的flash动画。
3.2.3JavaScript语言及js文件的应用。
JavaScript是目前比较流行的一种制作网页特效的语言,灵活运用JavaScript能使网页版面更生动有趣。设计中大量运用了Javascript语言特效,这里举两个本设计中较简单的例子说明JSP语言的强大魅力。
- 11 -
a. 鼠标控制图片的明暗效果
其中if语句是定义图片显示的方法,分别为以100亮度显示和以20亮度显示,if which==0,则100亮度,which==1,则20亮度。用标记的语句是为了设置图片的样式。内容是插入”flower.jpg”图片,定义边框为0,初时显示形式为20亮度,当鼠标放到图片上时,which为0,图片离开时,which为1。
b.节假日倒计时
程序一开始定义了urodz变量,其值为“8/8/2008“,now变量为当前日期,最后用ile和dni变量式计算出余下日期。如果日期大于0,输出”今天离北京奥运会开幕还有**天”的语句,其中北京奥运会开幕字体为红色。语句document.write是输出数据到页面上的标签。
- 12 -
相关推荐: