WordPress显示当前页面子菜单

我试图寻找这个，但我想我是错误的措辞措辞。我想要做的是如果用户正在查看该页面，则会出现一个子菜单。有点类似于下拉菜单，但不是悬停效果，我希望它显示您是否在当前页面上，也许使用.current-menu-item函数？WordPress显示当前页面子菜单

这是代码我目前：

.header-menu { 
    width: 100%; 
} 

.header-menu li { 
    background: url("images/arrow.png") no-repeat left center; 
    height: 40px; 
    margin: 0; 
    padding-left: 15px; 
    line-height: 40px; 
    -webkit-transition:background-position .3s ease-in; 
    -moz-transition:background-position .3s ease-in; 
    -o-transition:background-position .3s ease-in; 
    transition:background-position .3s ease-in; 
} 

.header-menu li:hover { 
    background: rgba(31, 73, 125, 0.8) url("images/arrow-hover.png") no-repeat left center; 
} 

.header-menu li a { 
    display: block; 
    margin: 0 5px; 
    font-size: 18px; 
} 

.header-menu ul.sub-menu { 
    display: none; 
} 

.header-menu .current-menu-item { 
    background: rgba(31, 73, 125, 0.8) url("images/arrow-hover.png") no-repeat right center; 
}

老实说，我不能想办法把它关闭，它有点像一个if/else语句的CSS，我真的希望存在马上。谢谢，任何帮助！如果能够完成工作，我完全愿意使用JQuery。

EDIT

FIDDLE

来源

2015-06-17 Protocol Zero

你可以做一个Codepen或的jsfiddle在它的HTML结构，也？然后，有人可以将其分叉并提供更完整的答案。 – jacobroufa

这是行不通的？ .header-menu .current-menu-item ul.sub-menu {display：block;} – gopalraju

好吧，我使用的是WordPress，我没有手动编写菜单的HTML代码，但我可以复制源代码如果它会帮助。 –

使用

.header-menu .current-menu-item ul.sub-menu { 
display:block; 
}

和

.header-menu .current-menu-item{ 
height:auto 
}

以除去重叠。

Fidddle： http://jsfiddle.net/ghnd4ae3/2/

来源

2015-06-17 20:43:23 gopalraju

This Works，thank you！ –

WordPress显示当前页面子菜单

回答

相关问题