1、怎样用 显示/隐藏层 制作二级下拉子菜单项
不是吧山东农业大学选修课网页制作作业也是这个题哎我直接把题全给你们行了呵呵以后考试就轻松了呵呵
2009-2010学年第二学期
《信息发布与网页制作》课程
本科生 期末考试要求-（A卷）
课程课序号：CMP332
学 号___________姓 名_________成 绩__________
班 级_____________课序号_________任课教师___________
题号
一
二
三
四
五
合计
得分
综合考试要求
1、按题中要求，独立完成。如有拷贝或与他人雷同者，以0分论处。
2、作业提交的截止日期为：2010年7月2日。
一、（共5分）按如下要求提交文件 得分______
以自己的学号命名文件夹，并以此根文件夹为基础创建站点；
在根文件夹下，至少包含如下子文件夹，按类存放站点中的所有文件；
1、Html文件夹：存放HTML网页文件（1）
2、Image文件夹：存放图片文件（1）
3、Sound文件夹：存放声音文件（1）
4、Flash文件夹: 存放Flash文件（1）
5、压缩整个学号文件夹，然后提交交互平台。（1）
二、（共10分）设计小型网站，内容主题为“上海世博会”，要求如下： 得分______
设计有3个窗口的框架集网页（3），框架集网页文件命名为index.html（2）。框架集网页中，左侧窗口中放置导航栏目网页（1），右下侧窗口作为导航栏被链接网页的“目标”窗口，用于显示被链接的网页（1）。右上侧窗口显示网站主题、网站设计制作者学号、姓名（1）。要求框架集网页的边框可调（1），窗口中内容超出窗口时，要设置滚动条（1）。
三、（共65分）分别制作6个网页，要求如下： 得分______
1) 导航栏网页（15分）
网页的功能是网站导航，围绕站点主题，设置5个导航栏目（6）。
1. 上海世博会主题介绍
2. 上海世博会拼图游戏
3. 历届世博会科技亮点
4. 上海世博会调查问卷
5. 历届世博会统计资料 （年份、国家、举办城市、主题）
建立每个栏目与之相应的网页之间的链接，并指定被链接的网页在“目标”窗口显示（4）。利用行为，建立二级弹出子菜单，通过二级子菜单链接，显示相关的内容（5）。所有链接正确（如不正确，1处扣2分）。
2) “网页1-上海世博会主题介绍”：（10分）
1. 首行显示网站主题内容，用标题1、居中、“华文新魏”字体显示（2）；
2. 第2行，插入水平线；设置水平线的宽度为浏览器窗口宽度的80%（2）；
3. 第3行，插入上海世博会导览图，设置800宽、600高（2），图片居中并有边框显示（1）；对图中内容分别用矩形、椭圆、多边形热区画图工具设立3个热区，通过链接，说明相关内容。（3）
3) “网页2-上海世博会拼图游戏”（10分）
利用拖动层的行为，制作至少由6块图片组成的拼图游戏。要求：
1. 选择1个国家场馆的图片，用自己的学号命名图片；（2）
2. 利用Fireworks将图片切割成大小相同的6块；导出切片；（2）
3. 在DreamWeaver中，导入Fireworks HTML，将表格转换为层；添加拖动层的行为，制作拼图游戏；（2）
4. 插入1个布局对象层并以字母L及自己的学号命名，在层中输入拼图游戏的说明文字，设置层中文字的大小：18px ；字体：隶书（2）；
5. 设置拖动层的吸附距离为100：吸附到正确位置时显示弹出信息（2）
4) “网页3-历届世博会科技亮点”（10）
要求：利用“显示/隐藏层”制作二级下拉子菜单项，
1、 利用层和表格制作下拉菜单（4）
2、 下拉菜单项中，至少有2个菜单项要有链接功能（2）
3、 指定被连接的内容在当前窗口显示并有返回机制。（4）
5) “网页4-上海世博会调查问卷”（共10分）
要求：使用表单，做1个网上调查表
1、 插入表单域，在表单域中插入如下表单元素：
2、 参与调查人员的性别：男 〇 女 〇（使用单选按钮）（1）；
3、 2010年世博会主题是： （设定为：单行文本框（宽度32字符 ））；（1）
4、 年龄 （设定为：字符宽度2）；（2）
5、 中国举办过几次世博会？（使用“列表/菜单”表示，列表项有：一次、二次、三次、四次）（2）
6、 提交按钮、重置按钮。（2）
7、 为表单添加检查表单行为，用以检查输入年龄的合法性（15~80为有效）。（2）
6) “网页5-历届世博会统计资料 （年份、国家、举办城市、主题）”（共10分）
该网页要求：
1、 用表格显示历届世博会举办的年份、国家、举办城市、主题；（2）
2、 利用DreamWeaver工具，格式化表格；（2）
3、 将歌词放在层中，滚动显示；（2）
4、 能控制歌词的滚动，以保证与歌曲同步。（4）
四、（共12分）按如下要求，在网页中插入自己制作的Flash作品 得分______
1、 在Flash文件夹中，存有Flash原始文件（2）；
2、 Flash片头显示作者学号、姓名（2）
3、 Flash表现的内容与网站内容主题一致（2）；
4、 分别使用“形状”、“动画”补间（2）；
5、 背景图层用自己的学号命名（2）；
6、 Flash作品中包括引导层、遮罩动画（2）
五、（共8分）综合分 得分______
整体色调协调（2），结构合理、浏览方便（2），网站难度（2），创新（2）
附件(0 个)
2、网页设计：下拉菜单的十几种表现形式
网页设计或者应用UI网页设计中经常会出现下拉菜单，主要是会将不常用的同类选项或者提醒放置其中，如何设计下拉菜单，网页设计出图片以及裁剪后的大小，然后后台再把这些做起来，这些作品或许能给你启发。下面先看下这些作品的设计风格，我相信会对你们有大的启发的，设计感实在是需要慢慢的积累创新的，时代进步不得不把我们带的进步。具体内容可以参看百家号
3、网页制作中，如何做二级菜单（就是鼠标滑过去才有显示）
你说的是把鼠标搁置在某个控件上停留一会，然后弹出快捷菜单吗？
其实我无形中已经告诉你办法了，鼠标事件选择“载入”或者“显示”，事件代码就是“弹出快捷菜单”并写上快捷菜单显示内容
4、网页制作中如何做下拉菜单
在Dreamweaver中轻松实现滑动折叠菜单-太平洋电脑网
http://www.pconline.com.cn/pce/sj/wz/dreamweaver/0603/776492_2.html
Dreamweaver MX 2004简体中文版进阶教程(三)之弹出菜单-中华网科技频道
http://tech.china.com/zh_cn/netschool/homepage/dreamweaver/develop/2005061503.html
蓝色理想 - 下拉菜单全攻略
http://www.blueidea.com/tech/web/2003/301.asp
5、网页设计 鼠标移到下拉菜单，下拉菜单就不见了，不是一级菜单与二级菜单层的位置没设置好，应该是其他的。
下拉菜单的制作来的详细步骤：
FW中的自做法：
1.打开软件---新建文档
2.绘制一个导航条----在上面输入文字
3.用最上面的选择工具----选中导航按钮（不要少点哦）----右键----“插入矩形切片”
4.导航上面出现了一个矩形将导航 盖住了，-----你可以看到上面有个白色的小圆圈-----选中 它（一定是白色的小圆圈）-------右键------“添加弹出菜单”
5.设置你的下拉菜单就行了。。 "内容" “外观” "高级" "位置"
6.调整一下你的切片位置和大小。
7.预览（f12)
8.文件----导出----html和图像。
9.ok大致步骤就这么多。
再打开 dreamweaver
1."插入"---“图像对象”----“fireworks HTML”
2.“浏览”----将做好的那个导航条在加进来。
按上面的步骤做就可以了，，这可是详细的步骤。。先用FW，然后用DW就OK了。。
6、如何制作网页首页导航菜单显示二级菜单
<!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=utf-8" />
<title>无标题文档</title>
<style>
.sever{ margin-top:4px;}
.sever_menu{ width:213px; background:#99ABB9;}
.sever_menu a{ display:block; }
.sever_menu img{ *margin-bottom:-2px;}
.help_menu,.help_menu_main{ line-height:25px; }
.help_menu{ height:25px; background:#4AC5E8; border-bottom:1px solid #99ABB9;text-indent:57px;}
.help_menu a{ background:url(../images/help_arr.jpg) no-repeat 43px center;}
#sever_left .help_menu:hover a{ color:#fff;}
.help_menu .hover{ background:url(../images/help_hover_arr.jpg) no-repeat 43px center; color:#FFFFFF;}
.help_menu_main ul{ text-indent:63px;}
.help_menu_main ul li{ border-bottom:1px solid #B3BFCB;}
.help_menu_main ul li a{ color:#fff;}
</style>
<script>
// JavaScript Document
function setTab(name,cursel,n){
for(i=1;i<=n;i++){
var menu=document.getElementById(name+i);
var con=document.getElementById("con_"+name+"_"+i);
menu.className=i==cursel?"hover":"";
con.style.display=i==cursel?"block":"none";
}
}
//-->
</script>
</head>
<body>
<div class="sever">
<div class="sever_menu L" id="sever_left">
<img src="images/sever_help.jpg" />
<div class="help_menu"><a id="help1" onclick="setTab('help',1,9)" class="hover">新手上路</a></div>
<div id="con_help_1" class="help_menu_main">
<ul>
<li><a href="#">·注册/登录</a></li>
<li><a href="#">·发布信息</a></li>
<li><a href="#">·网上防骗</a></li>
<li><a href="#">·常见问题</a></li>
</ul>
</div>
<div class="help_menu"><a id="help2" onclick="setTab('help',2,9)">如何销售</a></div>
<div id="con_help_2" class="help_menu_main" style="display:none">
<ul>
<li><a href="#">·注册/登录</a></li>
<li><a href="#">·发布信息</a></li>
<li><a href="#">·网上防骗</a></li>
<li><a href="#">·常见问题</a></li>
</ul>
</div>
<div class="help_menu"><a id="help3" onclick="setTab('help',3,9)">如何采购</a></div>
<div id="con_help_3" class="help_menu_main" style="display:none">
<ul>
<li><a href="#">·注册/登录</a></li>
<li><a href="#">·发布信息</a></li>
<li><a href="#">·网上防骗</a></li>
<li><a href="#">·常见问题</a></li>
</ul>
</div>
<div class="help_menu"><a id="help4" onclick="setTab('help',4,9)">交易安全</a></div>
<div id="con_help_4" class="help_menu_main" style="display:none">
<ul>
<li><a href="#">·注册/登录</a></li>
<li><a href="#">·发布信息</a></li>
<li><a href="#">·网上防骗</a></li>
<li><a href="#">·常见问题</a></li>
</ul>
</div>
<div class="help_menu"><a id="help5" onclick="setTab('help',5,9)">操作指南</a></div>
<div id="con_help_5" class="help_menu_main" style="display:none">
<ul>
<li><a href="#">·注册/登录</a></li>
<li><a href="#">·发布信息</a></li>
<li><a href="#">·网上防骗</a></li>
<li><a href="#">·常见问题</a></li>
</ul>
</div>
<div class="help_menu"><a id="help6" onclick="setTab('help',6,9)">商人通服务</a></div>
<div id="con_help_6" class="help_menu_main" style="display:none">
<ul>
<li><a href="#">·注册/登录</a></li>
<li><a href="#">·发布信息</a></li>
<li><a href="#">·网上防骗</a></li>
<li><a href="#">·常见问题</a></li>
</ul>
</div>
<div class="help_menu"><a id="help7" onclick="setTab('help',7,9)">商业资讯</a></div>
<div id="con_help_7" class="help_menu_main" style="display:none">
<ul>
<li><a href="#">·注册/登录</a></li>
<li><a href="#">·发布信息</a></li>
<li><a href="#">·网上防骗</a></li>
<li><a href="#">·常见问题</a></li>
</ul>
</div>
<div class="help_menu"><a id="help8" onclick="setTab('help',8,9)">展会帮助</a></div>
<div id="con_help_8" class="help_menu_main" style="display:none">
<ul>
<li><a href="#">·注册/登录</a></li>
<li><a href="#">·发布信息</a></li>
<li><a href="#">·网上防骗</a></li>
<li><a href="#">·常见问题</a></li>
</ul>
</div>
<div class="help_menu"><a id="help9" onclick="setTab('help',9,9)">广告帮助</a></div>
<div id="con_help_9" class="help_menu_main" style="display:none">
<ul>
<li><a href="#">·注册/登录</a></li>
<li><a href="#">·发布信息</a></li>
<li><a href="#">·网上防骗</a></li>
<li><a href="#">·常见问题</a></li>
</ul>
</div>
</div>
</div>
</body>
</html>
这个拿去参考一下吧~~
7、如何用图片导航做二级下拉菜单（急）！！！
用这个下拉菜单来修改就可以
8、网页制作，慢慢下拉的菜单怎么做？
这个效果你可以通过2中途径实现，使用框架或者是使用JavaScript代码。
1.使用框架：查找框架中的二级菜单组建，如Bootstrap中的导航条中的二级菜单。下面的是一个二级下拉菜单的例子
详细内容参见http://v3.bootcss.com/components/#navbar
2.使用JavaScript代码。使用jQuery的动画实现，如slideToggle()可使元素上下滑动，并且可以使用参数控制快慢。
<script>slideToggle()请参考http://www.w3school.com.cn/jquery/jquery_slide.asp