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顯示當前頁面子菜單

回答

相關問題