[JS]아코디언식 메뉴 스크립트 관련 질문을 드립니다.
본문
(function($){
$(document).ready(function(){
$('.menulist li.active').addClass('open').children('ul').show();
$('.menulist li.has-sub>a').on('click', function(){
$(this).removeAttr('href');
var element = $(this).parent('li');
if (element.hasClass('open')) {
element.removeClass('open');
element.find('li').removeClass('open');
element.find('ul').slideUp(350);
}
else {
element.addClass('open');
element.children('ul').slideDown(350);
element.siblings('li').children('ul').slideUp(350);
element.siblings('li').removeClass('open');
element.siblings('li').find('li').removeClass('open');
element.siblings('li').find('ul').slideUp(350);
}
});});})(jQuery);
기존에는 해당 코드로
<li class="has-sub active">
<a href="#">메뉴10</a>
<ul>
<li><a href="#">메뉴1010</a></li>
<li><a href="#">메뉴1020</a></li>
</ul>
</li>
<li class="has-sub active">
<a href="#">메뉴20</a>
<ul>
<li><a href="#">메뉴2010</a></li>
<li><a href="#">메뉴2020</a></li>
</ul>
</li>
메뉴명을 누를 경우 하위 메뉴들이 숨김 처리되고 있습니다. 다시 누르게 되면 열림 이런
아코디언 형태의 메뉴를 사용하고 있지만, 현재는 1번 메뉴를 열면 2번이 닫히고
2번 메뉴를 열면 1번이 닫히는 상태인데...
1번 관계 없이, 해당 메뉴를 눌렀을때만 열림이 되고 닫힘이 되도록 하려면...
스크립트를 어떻게 수정을 해야할지 ㅠ 조언을 부탁드려봅니다.
답변 1
아래 부분만 주석처리하면 되지 않나요?
/*
element.siblings('li').children('ul').slideUp(350);
element.siblings('li').removeClass('open');
element.siblings('li').find('li').removeClass('open');
element.siblings('li').find('ul').slideUp(350);
*/
답변을 작성하시기 전에 로그인 해주세요.
