CSS - 悬停可见另一个子菜单

CSS - hover visible another submenu

我正在使用 Wordpress 菜单,其中有 classic 菜单和项目的子菜单。当我悬停某些具有 children 的项目时,将显示子菜单。问题是当我有一些页面并且我想显示当前页面的固定子菜单时。

我的 JSFiddle 在这里 http://jsfiddle.net/d2Lcukoe/ 您可以在其中看到我的菜单,悬停在 "Live show" 或 "Elvis Presley" 上您将看到子菜单。 Elvis Presley 是我当前的页面 - 有 css class current-menu-item。我想让它的子菜单在没有悬停的情况下可见,但是当我悬停 Live show 以查看其子菜单(另一个子菜单)并且当我取消悬停时再次看到当前子菜单时仍然可见。

我上次试过 css class 这个:

.second-navigation ul > li.current-menu-item > ul {
      visibility: visible;
}

它会显示当前子菜单,但悬停时我看不到 "Live show" 的另一个子菜单。我怎样才能做到这一点?抱歉英语不好。

JSFiddle 中的答案最好。

您应该可以通过添加 following:

来实现这一点
li.current-menu-item .sub-menu {
    visibility: visible;
    z-index: 100;
}

当当前菜单项有子菜单时,它被设置为可见,z-index 设置为 100。另一个子菜单的 z-index 为 101,所以它会显示和隐藏另一个子菜单。