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

ASP.NET
使用函数传递参数来执行相应的数据库操作
如何实现在窗体和窗体之间进行传递数据
ASP.NET中文显示之两种解决方法
ASP.NET、JSP及PHP之间的抉择
ASP.NET 2.0发送电子邮件中存在的问题
谈谈HtmlControl与WebControl的区别与用途
从ASP.NET 1.1升级到ASP.NET 2.0要考虑的Cookie问题
通过系统配置来提高ASP.NET应用程序的稳定性
妙用ASP2.0中的URL映射改变网址
AJAX实现web页面中级联菜单的设计
ASP.NET跨页面传值技巧总结
再议ASP.NET DataGrid控件中的“添加新行”功能
Geometry 对象浅析
重构CollapsibleSplitter
如何利用.NET Framework使用RSS feed
ASP.NET获取IP与MAC地址的方法
在ASP.NET 2.0中使用样式、主题和皮肤
ASP.NET中为GridView添加删除提示框
ASP.NET 2.0,无刷新页面新境界
看看一个.net版对话框控件

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


出处:互联网   整理: 软晨网(RuanChen.com)   发布: 2009-08-14   浏览: 152 ::
收藏到网摘: 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,可不用。

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