原创力文档- 1、本文档共45页，可阅读全部内容。
- 2、原创力文档（book118）网站文档一经付费（服务费），不意味着购买了该文档的版权，仅供个人/单位学习、研究之用，不得用于商业用途，未经授权，严禁复制、发行、汇编、翻译或者网络传播等，侵权必究。
- 3、本站所有内容均由合作方或网友上传，本站不对文档的完整性、权威性及其观点立场正确性做任何保证或承诺！文档内容仅供研究参考，付费前请自行鉴别。如您付费，意味着您自己接受本站规则且自行承担风险，本站不退款、不进行额外附加服务；查看《如何避免下载的几个坑》。如果您已付费下载过本站文档，您可以点击 这里二次下载。
- 4、如文档侵犯商业秘密、侵犯著作权、侵犯人身权等，请点击“版权申诉”（推荐），也可以打举报电话：400-050-0827(电话支持时间：9:00-18:30)。
查看更多
DW网页设计教学—单元3创建超级链接与导航栏剖析
【3.3 技术提升】 【任务3-6】创建下拉菜单和自动展开菜单 【任务描述】 （1）创建纵向下拉列表菜单。 （2）创建自动展开与收缩菜单。 （3）编写JavaScript代码，实现菜单的展开与收缩功能。 纵向下拉列表菜单和自动展开与收缩菜单的浏览效果如图3-22所示。 图3-22 纵向下拉列表菜单和自动展开与收缩菜单的浏览效果 【任务实施】 1．创建纵向下拉列表菜单。 打开文件夹“3-3”中网页文档0303.html，在该网页中“ul id=droplist_ul”下面输入以下HTML代码。 li id=n0ema href=default.htm 首页/a/em/li li onmouseover=menu_drop(n1,block); onmouseout=menu_drop(n1,none);em a href=#笔记本/a/em ul id=n1 lia href=#笔记本电脑/a/li lia href=#笔记本配件/a/li lia href=#电脑包/a/li /ul /li li onmouseover=menu_drop(n2,block); onmouseout=menu_drop(n2,none);em a href=#数码影音/a/em ul id=n2 lia href=#数码影像/a/li lia href=#MP3/MP4/a/li lia href=#GPS/a/li lia href=#便携移动存储/读卡器/a/li lia href=#时尚小数码/a/li lia href=#相机/摄象机配件/a/li lia href=#录音笔/a/li /ul /li ……!-- 后面更多的代码在此被省略，详见教材配套光盘中对应的网页文档-- 2．创建自动展开与收缩菜单。 在网页文档0303.html中纵向下拉列表菜单的HTML代码之后输入以下HTML代码。 div id=login-box div id=quick-nav onmouseover=menu_drop(menu,block); onmouseout=menu_drop(menu,none); a class=quick-a href=# onfocus=menu_drop(menu,block); 快速导航/a div id=menu div id=menu-tita id=menu-close“ href=javascript:void(0); onclick=menu_drop(menu,none); title=关闭X/a /div div id=menu-inc dl id=menu-col-1 dt产品/dt dda href=#手机/a | a href=#MP3/MP4/a | a href=#MID/a | a href=#EBook/a /dd dda href=#最新活动/a | a href=#新品信息/a | a href=#产品论坛/a /dd /dl dl id=menu-col-2 dt服务与支持/dt dda href=#定制服务/a | a href=#销售网点/a | a href=#售后网点/a | a href=#服务条款/a /dd dda href=#问吧/a | a href=#在线投诉/a | a href=#常见问题/a /dd dda href=#产品注册/a | a href=#配件真伪查询/a | a href=#资源下载/a /
文档评论（0）