当前位置: 首页 > 图文教程 > 网络编程 > ASP.NET > 一个不被flash、select、activex遮挡的、跨frame的无限分级菜单

ASP.NET
动态加载Js代码到Head标签中的脚本
asp.net Parameters.AddWithValue方法在SQL语句的 Where 字句中的用法
ASP.NET 运行时错误: 没有为扩展名“.asax”注册的生成提供程序修正版
Convert.ToInt32与Int32.Parse区别及Int32.TryParse
WebService出现"因 URL 意外地以 结束,请求格式无法识别"的解决方法
asp.net(C#) Xml操作(增删改查)练习
asp.net 分页sql语句(结合aspnetpager)
asp.net开发与web标准的冲突问题的一些常见解决方法
asp.net Repeater中使用if的代码
Asp.net FCKEditor 2.6.3 上传文件没有权限解决方法
C# 命名规则(挺不错的)
asp.net 动态生成控件并获取其值
使用DataGrid中扩展ItemRenderer和HeaderRenderer进行操作
asp.net Hashtable 遍历写法
asp.net GridView和DataList实现鼠标移到行行变色
C# 邮件地址是否合法的验证
.net发送邮件实现代码
ASP.Net 上传图片并生成高清晰缩略图
asp.net 事件与委托分析
C# 无限级分类的实现

ASP.NET 中的 一个不被flash、select、activex遮挡的、跨frame的无限分级菜单


出处:互联网   整理: 软晨网(RuanChen.com)   发布: 2009-08-14   浏览: 317 ::
收藏到网摘: n/a

一个不被flash、select、activex遮挡的、跨frame的无限分级菜单

该菜单改良自著名的chromemenu,可以无限分级,使用方法:

1、添加主菜单项

找到类似下面代码的部分:

以下为引用的内容:

<div class="chromestyle" id="chromemenu">
<ul>
<li><a href="http://www.dynamicdrive.com">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-->
<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控制。

再来看怎么添加分级菜单,先看代码:

以下为引用的内容:

<!--子菜单1-->
<div id="dropmenu6" class="menu">
  <ul>                   
    <li><a href="#" target="_self" title="驾驶舱">驾驶舱</a>
    <!--[if lte IE 6]><a href="#">驾驶舱<font face='Webdings' style='font-size: 6pt'>4</font><table><tr><td> <![endif]-->
      <ul>
        <li><a href="http://eip/C19/进入管理驾驶舱/default.aspx" title="管理驾驶舱">管理驾驶舱</a></li>
        <li><a href="http://eip/C19/进入管理驾驶舱/default.aspx" title="单位预警舱">单位预警舱</a></li>
      </ul>
      <!--[if lte IE 6]> </td></tr></table></a> <![endif]-->
    </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>

要为哪个菜单项建立子菜单,就在其<li>内部添加代码段:

以下为引用的内容:

<!--[if lte IE 6]><a href="#">驾驶舱<font face='Webdings' style='font-size: 6pt'>4</font><table><tr><td> <![endif]-->
<ul>
<li><a href="http://eip/C19/进入管理驾驶舱/default.aspx" title="管理驾驶舱">管理驾驶舱</a></li>
<li><a href="http://eip/C19/进入管理驾驶舱/default.aspx" title="单位预警舱">单位预警舱</a></li>
</ul>
<!--[if lte IE 6]> </td></tr></table></a> <![endif]-->

注意开始和结束部分的绿色部分一定要带上   ,可以给由子菜单的菜单项加上一些特殊标记,以示由下一级菜单,比如上述代码中的“<font face='Webdings' style='font-size: 6pt'>4</font>”,即可在菜单项文字后面添加一个右向箭头。

注意子菜单中的“<li><iframe style="position:absolute;top:0px; left:0px;z-index:2;width:150px;height:176px;border:0;" frameborder=0 scrolling=no></iframe></li>”,目的是解决被activex覆盖的问题,如果页面上没有activex,可不用。

此段代码在一个较大项目的企业门户部分使用,测试没有问题,该项目已经验收完毕,代码中没有病毒。乱码应该是编码问题造成的,我的系统是英文版的。