如何用dreamweaver8.0制作下拉式菜单呢？
4个回答
展开全部
首先，在自己理想的位置设置好链接A，然后添加一个层Layer1，在层里面添加好你想要的下拉菜单，可以用表格形式。记得在层属性里设置层是隐藏的“hidden”。层的位置一定要紧贴A的位置，做到鼠标从A过去直接就能到层Layer1上！这一点很重要，不然不容易实现这个菜单的功能。
然后就是真正实现这个功能的时候了，在标签面板里给A添加行为"显示-隐藏层"，在弹出的对话框里选中层Layer1，然后点显示，再确定，然后你会发现标签面板里有了你刚添加的行为！把行为的触发改为“OnMouseOver”，意思就是当鼠标掠过A就会显示层Layer1。这就实现了第一步，我们必须在添加一个行为，同样的道理让鼠标离开A的时候菜单消失。就是仍然给A添加行为"显示-隐藏层"，在弹出的对话框里选中层Layer1，这次点隐藏，再确定，然后你会发现标签面板里有了你刚添加的两个行为！把第二个行为的触发改为“OnMouseOut”。
链接的行为设置好了，还得设置菜单“层Layer1”的行为了！用上述同样的方法给“层Layer1”添加俩"显示-隐藏层"的行为，对象仍然是层Layer1自己，只不过一个要显示一个要隐藏。把显示的那个行为设置触发为“onMouseOver”，隐藏的那个行为设置触发为“onMouseOut”。
现在就可以预览一下了，有的人会发现鼠标放在层Layer1菜单上的文字时很正常，但是离开文字在层Layer1上的空白区域，层Layer1就会消失！这时候只需要给层加个背景色或者背景图片就OK了！
嘿嘿 我也是随便说的哦！
然后就是真正实现这个功能的时候了，在标签面板里给A添加行为"显示-隐藏层"，在弹出的对话框里选中层Layer1，然后点显示，再确定，然后你会发现标签面板里有了你刚添加的行为！把行为的触发改为“OnMouseOver”，意思就是当鼠标掠过A就会显示层Layer1。这就实现了第一步，我们必须在添加一个行为，同样的道理让鼠标离开A的时候菜单消失。就是仍然给A添加行为"显示-隐藏层"，在弹出的对话框里选中层Layer1，这次点隐藏，再确定，然后你会发现标签面板里有了你刚添加的两个行为！把第二个行为的触发改为“OnMouseOut”。
链接的行为设置好了，还得设置菜单“层Layer1”的行为了！用上述同样的方法给“层Layer1”添加俩"显示-隐藏层"的行为，对象仍然是层Layer1自己，只不过一个要显示一个要隐藏。把显示的那个行为设置触发为“onMouseOver”，隐藏的那个行为设置触发为“onMouseOut”。
现在就可以预览一下了，有的人会发现鼠标放在层Layer1菜单上的文字时很正常，但是离开文字在层Layer1上的空白区域，层Layer1就会消失！这时候只需要给层加个背景色或者背景图片就OK了！
嘿嘿 我也是随便说的哦！
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
DreamWeaver 是用标签行为的功能来制作下拉菜单的。
具体步骤：
在DreamWeaver中绘制层（注意是绘制层，不是插入div）
绘制一个 宽度130px; 高度20px; 的层 在层里插入同样大小的表格
这时DreamWeaver会自动命名ID为 Layer1
在此层下面 紧接着再绘一个宽度一样 高度为100px;的层
DreamWeaver会自动命名ID为 Layer2
同样在层也插入相同大小的表格，插入表格是 让文字分层居中。
选中 Layer2 让它默认是隐藏 （在Layer2左边点一下 让眼睛闭着就是隐藏的意思了）
在网页中选 Layer1 点标签行为面板的+ >>显示-隐藏层 选项
弹出窗口 选中Layer2 点显示 然后确定
在行为里添加onMouseOver（意思是鼠标经过时）
同样的方法 让 Layer2 隐藏
在行为里添加onMouseOut（意思是鼠标离开时）
这样就成功，可是会发现离开总菜单 下拉菜单也消失了，所以
最后还要选中 Layer2 再做一次 Layer2的onMouseOver onMouseOut 行为。
制作出的全部代码如下：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>无标题文档</title>
<style type="text/css">
<!--
#Layer1 {
position:absolute;
left:78px;
top:34px;
width:130px;
height:20px;
z-index:1;
}
#Layer2 {
position:absolute;
left:78px;
top:62px;
width:130px;
height:100px;
z-index:2;
visibility: hidden;
}
-->
</style>
<script type="text/JavaScript">
<!--
function MM_findObj(n, d) { //v4.01
var p,i,x; if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) {
d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}
if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n];
for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document);
if(!x && d.getElementById) x=d.getElementById(n); return x;
}
function MM_showHideLayers() { //v6.0
var i,p,v,obj,args=MM_showHideLayers.arguments;
for (i=0; i<(args.length-2); i+=3) if ((obj=MM_findObj(args[i]))!=null) { v=args[i+2];
if (obj.style) { obj=obj.style; v=(v=='show')?'visible':(v=='hide')?'hidden':v; }
obj.visibility=v; }
}
//-->
</script>
</head>
<body>
<div id="Layer1" onmouseover="MM_showHideLayers('Layer2','','show')" onmouseout="MM_showHideLayers('Layer2','','hide')">
<table width="130" border="1" cellpadding="2" cellspacing="1">
<tr>
<td align="center">总菜单</td>
</tr>
</table>
</div>
<div id="Layer2" onmouseover="MM_showHideLayers('Layer2','','show')" onmouseout="MM_showHideLayers('Layer2','','hide')">
<table width="130" border="1" cellpadding="5" cellspacing="1">
<tr>
<td align="center">菜单</td>
</tr>
<tr>
<td align="center">菜单</td>
</tr>
<tr>
<td align="center">菜单</td>
</tr>
<tr>
<td align="center">菜单</td>
</tr>
<tr>
<td align="center">菜单</td>
</tr>
</table>
</div>
</body>
</html>
具体步骤：
在DreamWeaver中绘制层（注意是绘制层，不是插入div）
绘制一个 宽度130px; 高度20px; 的层 在层里插入同样大小的表格
这时DreamWeaver会自动命名ID为 Layer1
在此层下面 紧接着再绘一个宽度一样 高度为100px;的层
DreamWeaver会自动命名ID为 Layer2
同样在层也插入相同大小的表格，插入表格是 让文字分层居中。
选中 Layer2 让它默认是隐藏 （在Layer2左边点一下 让眼睛闭着就是隐藏的意思了）
在网页中选 Layer1 点标签行为面板的+ >>显示-隐藏层 选项
弹出窗口 选中Layer2 点显示 然后确定
在行为里添加onMouseOver（意思是鼠标经过时）
同样的方法 让 Layer2 隐藏
在行为里添加onMouseOut（意思是鼠标离开时）
这样就成功，可是会发现离开总菜单 下拉菜单也消失了，所以
最后还要选中 Layer2 再做一次 Layer2的onMouseOver onMouseOut 行为。
制作出的全部代码如下：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>无标题文档</title>
<style type="text/css">
<!--
#Layer1 {
position:absolute;
left:78px;
top:34px;
width:130px;
height:20px;
z-index:1;
}
#Layer2 {
position:absolute;
left:78px;
top:62px;
width:130px;
height:100px;
z-index:2;
visibility: hidden;
}
-->
</style>
<script type="text/JavaScript">
<!--
function MM_findObj(n, d) { //v4.01
var p,i,x; if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) {
d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}
if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n];
for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document);
if(!x && d.getElementById) x=d.getElementById(n); return x;
}
function MM_showHideLayers() { //v6.0
var i,p,v,obj,args=MM_showHideLayers.arguments;
for (i=0; i<(args.length-2); i+=3) if ((obj=MM_findObj(args[i]))!=null) { v=args[i+2];
if (obj.style) { obj=obj.style; v=(v=='show')?'visible':(v=='hide')?'hidden':v; }
obj.visibility=v; }
}
//-->
</script>
</head>
<body>
<div id="Layer1" onmouseover="MM_showHideLayers('Layer2','','show')" onmouseout="MM_showHideLayers('Layer2','','hide')">
<table width="130" border="1" cellpadding="2" cellspacing="1">
<tr>
<td align="center">总菜单</td>
</tr>
</table>
</div>
<div id="Layer2" onmouseover="MM_showHideLayers('Layer2','','show')" onmouseout="MM_showHideLayers('Layer2','','hide')">
<table width="130" border="1" cellpadding="5" cellspacing="1">
<tr>
<td align="center">菜单</td>
</tr>
<tr>
<td align="center">菜单</td>
</tr>
<tr>
<td align="center">菜单</td>
</tr>
<tr>
<td align="center">菜单</td>
</tr>
<tr>
<td align="center">菜单</td>
</tr>
</table>
</div>
</body>
</html>
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
在dw的菜单栏里面 插入--布局--spy菜单栏、spy选项卡式面板、spy折叠式。就可以做下拉菜单了。js是自动生成放在一个文件夹里面。
另外 我用的是DW cs3，dw8的应该差不多吧
另外 我用的是DW cs3，dw8的应该差不多吧
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
这有个网页健讲解很详细！ http://www.blueidea.com/tech/web/2003/301.asp
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
更多回答（2）
推荐律师服务：
若未解决您的问题，请您详细描述您的问题，通过百度律临进行免费专业咨询
