Question

我遇到了子菜单问题，因为我要求更新网站并修复问题（创建的员工不再在这里）。不可否认，我不是一个UI用户，而是试图解决这个问题。

当用户将鼠标移到子菜单项上时，菜单选项显示和子菜单显示，但是只要鼠标移动到子菜单，它就会消失。我将DisappearAfter标记提升为9999.现在菜单显示我无法点击菜单项进行导航。

       <div id="navigation-container" >
        <div id="navigation" >
            <asp:Menu ID="menuNavigation" StaticDisplayLevels="1" StaticSubMenuIndent="0" Orientation="Horizontal" 
                      Font-Names="Arial, Gill Sans" runat="server" DynamicEnableDefaultPopOutImage="True" 
                      StaticEnableDefaultPopOutImage="False" DisappearAfter="9999" DynamicHoverStyle-CssClass="navmenuitemhover" 
                      StaticSelectedStyle-BackColor="Red">
                <DynamicMenuStyle CssClass="headerzindex10" />
                <LevelMenuItemStyles>
                    <asp:MenuItemStyle CssClass="navlevel1"  />
                    <asp:MenuItemStyle CssClass="navlevel2" />
                    <asp:MenuItemStyle CssClass="navlevel3" />
                </LevelMenuItemStyles>
            </asp:Menu>
        </div>
        <asp:Label ID="lblOverview" runat="server" Text="Overview" CssClass="overviewLink"  />

    </div>

CSS代码：

#navigation-container
{   
width: 100%;
color: #000;
top:60px;
position:fixed; 
left:0px;
filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#4B79BC, endColorstr=#355DAF);
BACKGROUND-COLOR: #4b79bc;
z-index:10;
}


#navigation
{
margin:0px; 
position:fixed; /* This fixes the menu items issue*/    
padding-left:5px;
z-index:10;
}

.navlevel1
{
color: white;  
z-index:10;
top:35px;
padding:5px;
}


.navlevel2
{
color: black;
font-family: Gill Sans MT !important;
font-size: small;  
background-color: #a5bcdd;  
z-index:10;
top:35px;
}

.navlevel3
{
color: black;
background-color: #dbe4f1;
font-family: Gill Sans MT !important;
font-size: small;
z-index:10;
}

.navmenuitemhover
{
background-color:#253c5e;
color:White;    
font-weight:bold;
z-index:10;
}

.headerzindex10
{
position:relative;
z-index:10;
}

任何帮助将不胜感激。

Answer 1

经过多次搜索，CSS编辑，并将菜单重新作为JQ菜单，我发现行filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#4B79BC, endColorstr=#355DAF);导致了问题。我们公司使用IE8作为标准，我们被锁定升级。

在发现问题后进行的研究表明，在CSS中使用过滤器会导致元素的功能和位置出现很多问题，最好不要使用它们。

要修复的两个选项是使用在<DIV>上重复的背景图像，或者删除并使用纯色。由于菜单栏区域足够小，我们只使用了endColorstr菜单，它与标题的渐变很好地融合在一起。

ASP动态菜单子菜单在子菜单上的鼠标悬停时消失。

1 个答案: