悬停子菜单不起作用

我想创建一个子菜单，当我悬停Cath时，我想显示Insider和Outsider。（所有我想要的东西用CSS来实现）悬停子菜单不起作用

这里是我的代码，但东西拿错我的代码

/* ALL A HOVER */ 
 
.cath:hover > ul.submenu-items { 
 
    background:#778; 
 
} 
 

 
/* INNER UL HIDE */ 
 
.cath ul.submenu-items { 
 
    background:rgba(0,0,0,0.1); 
 
    padding-left:20px; 
 
    transition: max-height 0.2s ease-out; 
 
    max-height:0; 
 
    overflow:hidden; 
 
} 
 
/* INNER UL SHOW */ 
 
.cath:hover > ul.submenu-items{ 
 
    max-height:500px; 
 
    transition: max-height 0.25s ease-in; 
 
}

<div class='wr-element-container wr-element-submenu cath' ><div class="block-sub-menu"> 
 
    <a class=" caption" title="cath"><span class=""><span class="ig-menu-title">Cath </span></span></a> 
 
    <div class="clearfix"></div> 
 
    <span class="divider"></span> 
 
    <ul class="submenu-items "> 
 
    <li id="menu-item-1971" class="menu-item-1971"><a>Inside</a></li> 
 
    <li id="menu-item-1972" class="menu-item-1972"><a >Outside</a></li> 
 
    </ul> 
 
\t </div>

来源

2017-05-25 JORd

删除>选择，它会工作得很好。

>选择器只适用于直接的孩子，你的元素不是直接子cath，这意味着你需要使用空间来代替。

.cath:hover ul.submenu-items{ 
     .... 
    }

见代码片段：

/* ALL A HOVER */ 
 
.kathetou:hover > ul.submenu-items { 
 
    background:#778; 
 
} 
 

 
/* INNER UL HIDE */ 
 
.cath ul.submenu-items { 
 
    background:rgba(0,0,0,0.1); 
 
    padding-left:20px; 
 
    transition: max-height 0.2s ease-out; 
 
    max-height:0; 
 
    overflow:hidden; 
 
} 
 
/* INNER UL SHOW */ 
 
.cath:hover ul.submenu-items{ 
 
    max-height:500px; 
 
    transition: max-height 0.25s ease-in; 
 
}

<div class='wr-element-container wr-element-submenu cath' ><div class="block-sub-menu"> 
 
    <a class=" caption" title="cath"><span class=""><span class="ig-menu-title">Cath </span></span></a> 
 
    <div class="clearfix"></div> 
 
    <span class="divider"></span> 
 
    <ul class="submenu-items "> 
 
    <li id="menu-item-1971" class="menu-item-1971"><a>Inside</a></li> 
 
    <li id="menu-item-1972" class="menu-item-1972"><a >Outside</a></li> 
 
    </ul> 
 
\t </div>

来源

2017-05-25 18:17:51 Chiller

悬停子菜单不起作用

回答

相关问题