2.0 Menu 2级菜单过长加样式

            终于有时间写blog了，申请了一周之久，第一次写，最近遇到了一个问题，关于Menu的2级菜单，因为
要显示的项数量太多，所以它会越出父亲菜单，延伸到页面的最顶部，下面也延伸到了最下面，如果鼠标不
是3D的，你根本看不到下面的尖头（这个是MS Menu自带的功能，太高了会自动加）。整整我研究了一天Menu的属性，但就是没有能控制高度的，当我在google找资料的时候发现了CSS Control Adapter Toolkit for ASP.NET  ，通过它可以自己设计 Menu的样式，刚开始真的很兴奋，终于可以对复杂的ControlTools进行自己的样式定义，我照着例子自己做了一个Menu，恩，完全达到了自己想要的效果，以为大功告成，我把样式和代码加入到了我现有的程序中，运行，结果我所有其他没定义样式的Menu全变形了，真晕，查找原因，原因找到了App_Browsers里的文件，它定义了控件反射的效果，一定应该有解决办法吧！但目前还没有解决。

            希望有谁知道能告诉我，不过还好我在其他网页中得到了启示，我从不知道还可以对Menu的DynamicMenuStyle定义CssClass,这真的是太让我高兴了。马上做了个实验，一切OK。

            这个Menu的菜单项是通过另一个上级Menu点击动态绑上去的，上级菜单为地区菜单，帮定菜单是县区菜单，县区菜单的2级菜单是乡镇，如图：



下面写一些关键性代码：

< head  runat ="server" >
     < title > 话务变化分析 </ title >
     < meta  http-equiv ="Page-Enter"  content ="revealTrans(duration=1, transition=23)" />
     < link  href ="../Css/stylehuawutrend.css"  rel ="stylesheet"   />
     < link  rel ="stylesheet"  href ="../Css/Menu.css"  type ="text/css"   />
     < script  language ="javascript"  type ="text/javascript" >   
    function scrollwindowRight()  
    {
      var  menu = document.getElementById("menuDiv");
        menu.scrollLeft+=150;
    }
    function scrollwindowLeft()  
    {

        var  menu = document.getElementById("menuDiv");
        menu.scrollLeft-=150;
    }
     </ script >
</ head >

<% -- 区县乡镇集团导航 -- %>
                                 < table  cellpadding ="0"  cellspacing ="0"  width ="100%" >
                                     < tr >
                                         < td  align ="right" >< asp:Button  ID ="btnLeft"  runat ="server"  Text ="<<"   ForeColor ="#3366cc"
                                            Style =" border: 0; cursor: hand; vertical-align: middle;"
                                             OnClientClick ="scrollwindowLeft();return false;"  ToolTip ="向左移动菜单"  BackColor ="#f0f0f0"  Visible ="False"   /></ td >
                                         < td  align ="center" >
                                             < div  id ="menuDiv"  style ="overflow:hidden; width:600px;" >
                                             < asp:Menu  ID ="menuGroup"  runat ="server"  StaticTopSeparatorImageUrl ="~/Images/menu/blue.gif"  
                                                OnMenuItemClick ="menuGroup_MenuItemClick"   OnDisposed ="menuGroup_Disposed"  
                                                OnMenuItemDataBound ="menuGroup_MenuItemDataBound"  DisappearAfter ="5000" >
                                             < DynamicMenuStyle  CssClass ="Group"   />
                                            
                                             </ asp:Menu >
                                             </ div >
                                         </ td >
                                         < td  align ="left" >< asp:Button  ID ="btnRight"  runat ="server"  Text =">>"   ForeColor ="#3366cc"
                                            Style ="border: 0; cursor: hand; vertical-align: middle;"  BackColor ="#f0f0f0"
                                             OnClientClick ="scrollwindowRight();return false;"  ToolTip ="向右移动菜单"  Visible ="False"   /></ td >
                                         < td  style ="width:30px" ></ td >
                                     </ tr >
                                 </ table >
                                
                                
                                         <% --区县-- %>
             < asp:XmlDataSource  ID ="menuSectionXmlSource"  runat ="server"  CacheExpirationPolicy ="Sliding"  CacheKeyDependency ="60"   />

 

绑定县区 #region  绑定县区
    /**//// <summary>
    /// 绑定县区
    /// </summary>
    private void CityBind()
    {
        try
        {
            ConnectOracle();
            string strSection = string.Empty;
                 //这里strSection得到的是xml字符串
            strSection = m_resManager.GetAllCityAndCounty(menuNetType.SelectedItem.Value, menuRegion.SelectedItem.Value);
            m_resManager.DisconnectOle();
         
                //menuSectionXmlSource是XmlDataSource
            menuSectionXmlSource.Data = strSection;
            menuSectionXmlSource.XPath = "Region[@name = '" + menuRegion.SelectedItem.Value + "']/City";
            menuSectionXmlSource.DataBind();

            menuGroup.DataBindings.Clear();

            MenuItemBinding menuItemBinding = new MenuItemBinding();
            menuItemBinding.DataMember = "City";
            menuItemBinding.Depth = 0;
            menuItemBinding.TextField = "name";
            menuItemBinding.ValueField = "desc";
            menuItemBinding.ToolTipField = "level";
            menuGroup.DataBindings.Add(menuItemBinding);

            MenuItemBinding menuItemBinding1 = new MenuItemBinding();
            menuItemBinding1.DataMember = "County";
            menuItemBinding1.Depth = 1;
            menuItemBinding1.TextField = "name";
            menuItemBinding1.ValueField = "desc";
            menuItemBinding1.ToolTipField = "level";
            menuGroup.DataBindings.Add(menuItemBinding1);

            menuGroup.DataSourceID = "menuSectionXmlSource";
            menuGroup.DataBind();
        }
        catch(Exception ex)
        {
            Console.WriteLine(ex.Message);
        }
    }
    #endregion

 

/**/ /*
对应menu的最外层样式，即StaticMenuStyle
*/
.TopGroup
{} {
    background-color: white;
    background-image: url(../Image/item_bg.gif);
}

/**/ /*
对应menu的弹出层样式，即DynamicMenuStyle
*/
.Group
{} {
    border: solid 1px #737373;
    margin-top: 5px;
    height:300px;
    overflow:auto;
    overflow-x:hidden;
    position:fixed;
}


/**/ /*
对应menu的DynamicMenuStyle和StaticMenuItemStyle
*/
.Item
{} {
    font-family: 宋体,tahoma;
    font-size: 12px;
    margin: 1px;
    cursor: default;
}

/**/ /*
对应menu的StaticMenuSelectedStyle
*/
.ItemHover
{} {
    background-color: white;
    background-image: url(../Image/item_bg.gif);
    color: black;
    font-family: 宋体,tahoma;
    font-size: 12px;
    border: solid 1px #ABABAB;
    border-right-color: #737373;
    border-bottom-color: #737373;
    cursor: default;
}

/**/ /*
对应menu的DynamicMenuSelectedStyle
*/
.ItemExpanded
{} {
    background-color: white;
    background-image: url(../Image/item_bg.gif);
    color: black;
    font-family: 宋体,tahoma;
    font-size: 12px;
    border: solid 1px #737373;
    border-right-color: #ABABAB;
    border-bottom-color: #ABABAB;
    cursor: default;
}

 如果谁要再想要给2级菜单加滚动条的时候，可以参考一下，希望能做到抛砖引玉的效果。