随着网站页面极其功能的复杂化，越来越多的网站使用下拉菜单进行导航。熟悉javascript的朋友都知道，所谓下拉菜单其实是通过javascript控制每一个元素的可见属性实现的，当然这需要专门编写大段的代码。但是要是使用Fireworks MX就不需要这么麻烦，所有的代码都是由Fireworks MX自动生成的，你要做的只是美化一下界面，再简单的设置一下下拉菜单的选项就可以了。
下面就来看看怎样使用Fireworks MX增强的下拉菜单功能制作出让人羡慕的下拉菜单。
步骤1：
打开一个卡通人物图形，在工具栏上选择Text Tool写入文字：Click。并将其放置在图形的左上角（如图1）。
步骤2：
在工具栏上选择Slice Tool（切片工具），在文字上画一个矩形。切片工具的功能是制作小图片，以及将一张大图切成数张小图后以表格的形式进行发布，以增快下载的速度。每一个切片都可以添加链接或者是做为按钮。切片后的区域以绿色表示，我们可以在下方的Properties面板上精确调整切片的位置与大小（如图2）。
步骤3：
鼠标右键单击切片的绿色区域，在弹出的菜单中选择Add Pop-Up Menu（添加下拉菜单）（如图3）。
步骤4：
弹出的Pop-up Menu Editor（下拉菜单编辑器）对话框包含四个标签，分别对应不同的功能（如图4）。
单击Text标签下的区域，输入菜单的名称，例如：选项一。再单击加号，重复以上操作，即可添加所有的菜单选项，如果输入错误的话，点击减号就可以删除这一个选项（如图5）。
同样在Link标签下的区域可以输入此菜单选项的链接地址。
由于只是个练习，我们输入"#"符号，在Html标记语言中，链接地址为"#"代表链接到自身，也就是说是这样一个链接不论你如何点击你看到的都将是当前的页面，不会出现"页面不存在"的错误，很适合测试使用。
步骤5：
但是有的时候我们将使用到不止一级的菜单，可能在一级菜单的某个选项下还有二级菜单，甚至还会有三级菜单的存在，该如何面对如此复杂的情况呢？很简单，在此面板上有两个按钮分别是：Outdent Menu与Indent Menu，可以用来设置某一菜单选项下的子选项。你只需要先选择一个选项，再点击Indent Menu就可以将其设置为二级菜单，再点击Outdent Menu就可以将其恢复为一级菜单（如图6）。
以这样的方法你可以做出结构非常复杂的下拉菜单来。
步骤6：
在输入并设置好菜单选项后，选择Appearance选项卡。在这里，我们可以设置下拉菜单的外观属性。大家自己试一下就会熟悉，而值得注意的是Up State与Over State代表的是菜单的两种状态。在正常显示时是UP State而当鼠标移动到菜单选项上时就以Over State状态显示。我们可以分别在Style中为这两种状态设置不同的显示风格（如图7）。
|