在Fireworks4中制作弹出菜单全过程技巧大揭密-1

[复制链接]
查看: 236|回复: 0
gggds 发表于 2009-12-27 03:25:09 | 显示全部楼层 |阅读模式
一、 弹出菜单介绍9 A/ S( t8 i' Q) p
  随着动态交互式网页制作技术的发展,目前有很多网站都采用了一种弹出菜单的技术来实现网站的导航效果,例如微软及Macromedia的网站。在以前这都必须是具有专业的网页编程技术人员花费一定时间才能制作出来的效果,如今在Macromedia Fireworks4.0版本中能够轻松地制作了。弹出菜单的制作是Fireworks4中新增的一项强大的功能,利用它我们可以制作出常见的弹出菜单效果,甚至不需要花一点点的&106avascript编程技术。看来Macromedia Fireworks已经不满足于单纯的网页设计而是逐渐向丰富多彩的交互式网页设计制作靠拢了。
* b4 ]# a+ o" U: K. E  Y$ X  何谓弹出菜单技术呢?或许有些人会这样问。所谓的弹出菜单通常是在Web页中由鼠标来触发的一种菜单导航效果,当鼠标移动到导航菜单上触发条件满足,就会显示出弹出菜单。当鼠标从导航菜单上移开,弹出菜单自动消失。触发条件既可以是鼠标通过(On Mouse Over),也可以是鼠标单击(On Click),这种结构的菜单使我们能更加灵活的组织我们的菜单结构,而且下载时间又比较迅速。弹出菜单结构非常类似于一个表格,每一个导航菜单条目就好 比一个单元格。当然,Fireworks4中提供了四种鼠标动作,还有两种是鼠标移出(On Mouse Out)和页面加载(On Load),但显然他们不适合用在这里,因为这和通常浏览者的浏览习惯不符合。! y9 p/ k# \: d- i7 v7 Y5 S
二、 在Fireworks4中如何制作弹出菜单
, e. O7 p* v! H1 r$ b  看了上面的介绍,或许有很多人想知道该如何在Fireworks4中来制作这个看似高难度其实非常简单的效果呢,这部分我们就通过实例来讲解在Fireworks4中如何制作弹出菜单的基本制作过程。8 m0 m5 o* Z! j
  1、首先我们先来制作一个带有三个选项的菜单导航条,并为每个选项增加切片对象。Fireworks4的弹出菜单行为与其他行为一样,只能应用在按钮对象、切片对象或是热区对象上。(注:在Fireworks4中按钮对象上会自动添加切片对象,因此可以直接在按钮对象上使用各种行为。)' ]  |9 F, ^( F5 E8 q( c8 J5 z2 l

0 X2 D; j' K" ~$ t" V4 l6 x2 h& \2 r( l, z! c+ i7 O# G3 U
6 Z5 }' k4 z0 X+ `) j) a0 U
  2、为菜单导航条增加弹出菜单行为,首先必须选中一个按钮上的切片,有三种方法请选择其一:  (1) 打开Behaviors面版,点击\\\"+\\\"按钮添加弹出菜单行为命令Set Pop-Up Menu  (2) 使用菜单命令Insert>op-Up Menu  (3) 单击鼠标右健,在弹出的命令列表中选择Add Pop-up Menu命令
9 m' ]& ~8 F* R: o! }+ {0 h  3、选择了增加弹出菜单命令后,Fireworks4会出现弹出菜单制作向导窗口,您可以根据弹出菜单制作向导一步步地执行下去,其实过程非常的简单,仅仅只有二个步骤。
, R- J5 N5 n6 N二、 在Fireworks4中如何制作弹出菜单
1 c6 Z) j( X5 C7 M* M  4、首先出现的一个向导窗口是用来增加弹出菜单中的子菜单选项和为子菜单添加相关属性的。如下图所示:/ F8 T/ ~6 L  f7 y6 U3 D0 ?

& T( }3 Q! J) f+ K6 s& n
0 I$ r; h9 W( i2 j6 c9 ?

1 F/ U4 P* A2 K' h, e( _

0 M9 L+ c5 M$ ?6 w, r( x6 k  下面我来解释一下各个选项的作用:
; \& t% K5 W6 P% P( `! r0 b  (1) Menu选项:其右边有“+”、“-”二个按钮,根据Fireworks软件应用习惯,这二个按钮是用来添加或删除一个菜单选项时起作用的。
9 W) g$ d  W4 ]. ^! @  (2) Text选项:定义菜单选项的内容! ]2 E4 d, q" B  U9 h
  (3) Target选项:用来选择点击菜单选项链接时打开的窗口位置,其选项和Dreamweaver之类的网页制作软件的链接选项内容一样,这儿不再介绍。
9 E% L7 F9 j& `6 L% @7 K  (4) Link选项:用来设置菜单选项的链接属性
% x3 F; w. `9 ^- G5 |  (5)
! O! Q6 P+ d, I5 R
6 \( u; {' {; N. ~. n5 m这两个按钮可以控制子菜单的显示层次,点击右边的按钮可以使菜单项缩为下一级,点击左边的按钮可以使下一级菜单项向上升一级,这二个按钮不是随时随地都能使用的,而是会根据实际情况让您进行使用。利用这二个按钮可以方便的制作出多级弹出菜单。
" [: l$ u( a" a/ V* r3 P/ ~  (6) 如果您改变了某一条菜单项中的Text选项、Target选项或是Link选项中的一些值,可以点击Change按钮确定改变。4 l% S( N4 i& h
  向导窗口下面的大窗口表格中显示的是弹出菜单的结构,您定义的弹出菜单的各级内容都显示在这里。在本例中我定义了艺术字效果和动态字效果这二个菜单,在艺术字效果菜单中另外还分为卡通艺术字、变形艺术字、卷边艺术字这三个子菜单,在动态字效果菜单中也有其子菜单。您可以通过点击Menu 选项中的\\\"+\\\"按钮来增加菜单项,并分别设定它的链接地址和目标窗口;通过\\\"-\\\"按钮来删除选定的菜单项;您还可以选定一个菜单项后,修改已经填好的一些选项值,然后单击Change按钮改变它;您也可以选中一个菜单条目后上下拖动它到一个新的位置,以改变菜单的排序。当您将一个菜单项缩进时,它就自动变为下级子菜单。" Q% h- x: b' `: g' U
  菜单结构设定好后就,点击Next按钮进入下一步向导窗口。

本版积分规则

精彩图文

Copyright   ©2015-2016  展示网  Powered by©Discuz!  技术支持:凡尚展览     ( 粤ICP备14065977号 )