SideNavトグルの問題Liferay

Question

親の検出時にグリフアイコンのトグル機能を提供するデフォルトのナビゲーション機能をオーバーライドするLiferayのサイドメニューを作成しました。ドロップダウンがないときにグリフを右向きにし、ドロップダウンがあるときに下向きにするようにします。誰もがこの問題を解決するのに役立つことができますか？

ありがとうございます。

私のコードは次のとおりです。

java script: 
$(document).ready(function(){ 
if ($(".level-1 li").has('ul.level-2')){ 
$('ul.level-2').parent().find('a:first').after('<button class = "btnn"><span class = "chevron"></span></button>'); 
} 
$('ul.level-2').css('display','none'); 
$('button').click(function(){ 
$(this).next().slideToggle(); 

}); }); 


Css: 

.btnn { 
float: right; 
border-color: #E8EBF2; 
background-color: #E8EBF2; 
border: none; 
z-index:90; 
display:inline-block !important; 

} 


.level-1 li a { 
display:inline-block; 
} 


.chevron::before { 
border-style: solid; 
border-width: 0.25em 0.25em 0 0; 
content: ''; 
display: inline-block; 
height: 0.45em; 
left: 0; 
transform: rotate(45deg); 
position: relative; 
vertical-align: top; 
width: 0.45em; 
} 

.chevron:after { 
right: 0; 
transform: rotate(90deg); 
/* border-style: solid; */ 
border-width: 0 0 0 0; 
content: ''; 
display: inline-block; 
/* height: 0.45em; */ 
position: relative; 
vertical-align: top; 
/* width: 0.45em; */ 
} 

これは私のcodepenリンクhttp://codepen.io/anon/pen/EypNpQ

Answer 1

追加し、働いていた

$(document).ready(function(){ 
if ($(".level-1 li").has('ul.level-2')){ 
$('ul.level-2').parent().find('a:first').after('<button class = "btnn"><span class = "chevron"></span></button>'); 
} 
$('ul.level-2').css('display','none'); 
$('button').click(function(){ 
$(this).next().slideToggle(); 
    if($(this).hasClass('chevron-down')) 
    $(this).removeClass('chevron-down'); 
    else 
    $(this).addClass('chevron-down'); 
}); }); 

Here a working pen