首页 > 网页制作 > Dreamweaver教程

Dreamweaver怎么制作动态导航? dw网页添加动态导航的教程

admin Dreamweaver教程 2022-02-06 21:42:09 Dreamweaver   导航"

网页中经常能看到动态导航,想要使用dw设计一个动态导航,该怎么设计呢?下面我们就来看看详细的教程。

Adobe Dreamweaver CC 2017 v17.0 中文版(附安装教程) 64位

查看详情

1、制作导航栏,创建一个AP图层,设置好图层的背景颜色。

2、在AP图层内,新建一个一行四列的表格,输入文本,输入高值,居中对齐。再设置图层的高与表格一样。

3、在每个菜单下面,创建一个图层,比如新闻下面,并在图层下面插入一个一列三行的表格

4、设置新闻下的AP层为隐藏,点击预览就看不到这个图层。

5、选中新闻菜单所在的单元格,点击行为窗口,添加行为\显示隐藏元素。在弹出的对话框中选择刚才隐藏的层,并点击显示,确定,改变其事件为onmouseover

6、再根据刚才同样的方法,设置一个当鼠标移开,图层隐藏的行为。更改事件为onmouseout.

7、为了确保鼠标能够点击到下面图层内表格的内容链接,需要再进一步设置,把下面的图层移动到新闻表格的下方,并对齐,不留缝隙。

8、设置下面图层的属性,点击行为,添加行为,显示、隐藏元素,在对话框中点击显示,更改事件为onmouseover。同样也要设置一个鼠标移开隐藏元素的行为,在这里就不在演示了。

9、其他菜单一样设置。这样,整个动态导航栏就设置好了。

以上就是Dreamweaver网页添加动态导航的教程的教程,希望大家喜欢,请继续关注潘少俊衡。

相关推荐:

Dreamweaver怎么设计简单的导航按钮?

Dreamweaver怎么给网页添加下拉的条幅?

Dreamweaver网页中怎么插入导航条? dw网页导航条的使用方法

版权声明

本文仅代表作者观点,不代表本站立场。
本文系作者授权发表,未经许可,不得转载。
本文地址:/web/DW/78485.html

留言与评论(共有 0 条评论)
   
验证码:

潘少俊衡

| 桂ICP备2023010378号-4

Powered By EmpireCMS

爱享小站

中德益农

谷姐神农

环亚肥料

使用手机软件扫描微信二维码

关注我们可获取更多热点资讯

感谢潘少俊衡友情技术支持