Dreamweaver MX制作导航下拉菜单

| 网站首页 | 电子厨务 | 饮食信息 | 电子图库 | 厨客留言 | 520吃论坛 |

| 加入收藏
| 设为首页
| 联系站长

| 您现在的位置： 520吃 >> 电子厨务 >> 电脑基础 >> 网页制作 >> 文章正文

Dreamweaver MX制作导航下拉菜单 | ★★★ | 【字体：小 大】

Dreamweaver MX制作导航下拉菜单
作者：佚名 文章来源：本站原创 点击数： 更新时间：2006-9-6

Dreamweaver从出道以来，其简便易用而又功能强大的“行为”(Behavior)一直是大家所关注的热点之一。在Dreamweaver MX(DW MX)中，对这一功能又有了扩充与改进。

在DW MX中，行为指的是为了响应某一事件(Event)而采取的一个操作(Action)。其中Event 指的是浏览器的事件，比如窗口刷新、鼠标移动等。而 Action 指的是后台响应事件的 JavaScript 代码，可以完成相应的操作，比如播放声音、翻转图片等。

用DW MX制作导航下拉菜单是网页中经常使用的特效之一。(如图1)主要应用了DW MX中的“Show-Hide Layers”行为。

首先制作好导航条(图1中的“产品中心”那一栏)，随后添加一个层，作为下拉菜单将要显示的位置，并填入下拉菜单的对应栏目。
接下来，打开“Behaviors”面板，同时选中“产品中心”链接(注意，这个时候不能够选中刚刚建好的层，否则无法应用“Show-Hide Layers”行为)，单击“+”号，选择“Show-Hide Layers”，就可以看到我们刚刚建好的层在选择项中，可以设定为隐藏或者显示(如图2)。

行为的妙用主要体现在：如果我们要实现下拉菜单，关键就是让鼠标移到“产品中心”链接上时，使层显示；而鼠标离开链接时，使层隐藏。根据这种思想，我们首先为这个层设立两个Action，一个选择Hide，一个选择Show。然后，调整Event，将Hide Layer的Event设为OnMouseOut，即为鼠标离开链接；而将Show Layer的Event设为OnMouseOver，即为鼠标选中链接。按“F12”预览，就可看到我们期盼的效果。
这样，平时我们觉得很神秘的导航下拉菜单就可以轻易在行为中实现。还可以在导航链接上继续应用 “Swap Image”行为，实现鼠标点选链接时出现图片翻转效果。
行为不是一个个孤立的特效，可以由多个行为组合叠加实现复杂的功能，除了DW MX默认设置好的行为外，我们还可以从www.mcromedia.com上下载更多更酷的第三方行为，我们只需将它们直接复制到DreamweaverMX\Configuration\Behaviors\Actions\目录下即可，从而使DW MX的这一闪光点更加眩目。

最新热点

最新推荐

相关文章

Dreamweaver MX 2004
Dreamweaver中不支持中文文件
Dreamweaver如何制作浮动广告
Dreamweaver为网页图像添特效
Dreamweaver制作复杂交换图像
Dreamweaver查找替换的技巧
Dreamweaver MX巧妙格式化表
Dreamweaver MX创造网页鼠标
用Dreamweaver进行网页优化
Dreamweaver使用技巧

文章录入：admin 责任编辑：admin

- 上一篇文章： Dreamweaver为网页图像添特效
- 下一篇文章： Dreamweaver如何制作浮动广告

【发表评论】【加入收藏】【告诉好友】【打印此文】【关闭窗口】

网友评论：（只显示最新10条。评论内容只代表网友观点，与本站立场无关！）

服务热线:(0)15972979128 客服ＱＱ：２１４８８１３９ Email:summy@520chi.com

设为首页 | 加入收藏 | 联系站长 | 友情链接 | 版权申明 | 网站公告
Copyright (C) 2006 520chi.com, All Rights Reserved 版权所有 520吃网络 鄂ICP证B2-20060003号 如有意见请与我们联系 Powered by 520吃网络平台 免责申明：520吃网络(http://520chi.com)上的所有提供下载的软件和资源均来源于网络，为软件或程序作者提供和网友推荐收集整理而来，仅供学习和研究使用。如有侵犯你的版权，请立即联系我们，本站将在3个工作日内删除。