教程集 www.jiaochengji.com
教程集 >  CSS教程  >  正文 符合网页标准的无限网页分级菜单

符合网页标准的无限网页分级菜单

发布时间:2019-11-12   编辑:jiaochengji.com
教程集为您提供符合网页标准的无限网页分级菜单等资源,欢迎您收藏本站,我们将为您提供最新的符合网页标准的无限网页分级菜单资源

一个不被flash、select、activex遮挡的、跨frame的无限分级菜单
该菜单改良自著名的chromemenu,可以无限分级,使用方法:
1、添加主菜单项
找到类似下面代码的部分:

<table width="620" align="center" border="0" cellpadding="1" cellspacing="1" style="background:#FB7"> <tr> <td width="464" height="27" bgcolor="#FFE7CE"> 代码如下</td> <td width="109" align="center" bgcolor="#FFE7CE" style="cursor:pointer;" onclick="doCopy('copy2744')">复制代码</td> </tr> <tr> <td height="auto" colspan="2" valign="top" bgcolor="#FFFFFF" style="padding:10px;" class="copyclass" id=copy2744><div class="chromestyle" id="chromemenu">
<ul>
<li><a href="http://">Home</a></li>
<li><a href="#" rel="dropmenu1">Resources</a></li>
<li><a href="#" rel="dropmenu2">News</a></li>
<li><a href="#" rel="dropmenu3">Search</a></li>
</ul>
</div>

在<ul>内部添加一个<li>,即可新添加一个主菜单项,注意给出“rel”的值,如上述代码所示。
2、为一个主菜单添加下拉菜单:
先看一级菜单的写法:
<!--子菜单1-->

<table width="620" align="center" border="0" cellpadding="1" cellspacing="1" style="background:#FB7"> <tr> <td width="464" height="27" bgcolor="#FFE7CE"> 代码如下</td> <td width="109" align="center" bgcolor="#FFE7CE" style="cursor:pointer;" onclick="doCopy('copy1200')">复制代码</td> </tr> <tr> <td height="auto" colspan="2" valign="top" bgcolor="#FFFFFF" style="padding:10px;" class="copyclass" id=copy1200><div id="dropmenu1" class="menu">
<ul>
<li><a href="http://eip/C10/内部邮件/default.aspx" target="_self" title="内部邮件">内部邮件</a></li>
<li><a href="http://eip/待办公文/default.aspx" target="_self">待办公文</a></li>
<li><a href="http://eip/C18/日程任务/default.aspx" target="_self">工作安排</a></li>
<li><a href="http://eip/C1/公文处理/default.aspx" target="_self">公文处理</a> </li>
</ul>
</div>

注意div的id要和对应的主菜单项的rel参数相同,当鼠标移动到此菜单项时即可显示下拉菜单,菜单样式由class控制。

您可能感兴趣的文章:
符合网页标准的无限网页分级菜单
Google的网站收录和排名浅析
鼠标经过显示二级菜单js特效
如何设计一个成功的网站
搜索引擎优化技术教程之完全版 第七章 网页级别(PageRank)
7款风格新颖的jQuery/CSS3菜单导航分享
seo优化之企业网站标题怎么定位
超轻量级的基于jquery的三级展开列表
GOOGLE网站向网站管理员提供的建议
Google排名优化研究(二)

[关闭]
~ ~