펼침메뉴 고정하기 질문드립니다.

스크립트로 펼침메뉴(세로)를 만들고 있는데

일단 펼침은 되는데 하위메뉴를 클릭하면 메뉴들이 모두 닫힙니다.

1차 카테고리는 2차 카테고리가 열리면서 하위메뉴가 보여지는데

2차 카테고리를 클릭하면 1차 카테고리만 보여지고 모두 닫혀지네요~

1차와 2차 카테고리를 고정시키고 싶습니다. 방법이 있을지......ㅠ ㅜ

아래 소스는 HTML 입니다.

Copy

<div id='cssmenu' > 
    <ul class="menuCategory">

       <li class='has-sub {$selected}' module="product_displaycategory" style="display:{$display};"><a href="/product/list.html?{$param_cate_no}">{$category_name} <span class="count {$product_count_display|display}">({$product_count})</span></a>
          <ul module="product_children">
             <li class='has-sub2 {$selected}' style="display:{$display};"><a href="/product/list.html?{$param_cate_no}" >{$category_name} <span class="{$product_count_display|display}">({$product_count})</span></a>
                <ul module="product_children" class="subCategory">
                   <li class='has-sub3 {$selected}'><a href="/product/list.html?{$param_cate_no}"><i class='fas fa-caret-right'></i> {$category_name} <span class="{$product_count_display|display}">({$product_count})</span></a></li>
                   <li class='has-sub3 {$selected}' ><a href="/product/list.html?{$param_cate_no}"><i class='fas fa-caret-right'></i> {$category_name} <span class="{$product_count_display|display}">({$product_count})</span></a></li>
                </ul>
             </li>
             <li class='has-sub2 {$selected}' style="display:{$display};"><a href="/product/list.html?{$param_cate_no}">{$category_name} <span class="{$product_count_display|display}">({$product_count})</span></a>
                <ul module="product_children" class="subCategory">
                   <li class='has-sub3 {$selected}'><a href="/product/list.html?{$param_cate_no}"><i class='fas fa-caret-right'></i> {$category_name} <span class="{$product_count_display|display}">({$product_count})</span></a></li>
                   <li class='has-sub3 {$selected}'><a href="/product/list.html?{$param_cate_no}"><i class='fas fa-caret-right'></i> {$category_name} <span class="{$product_count_display|display}">({$product_count})</span></a></li>
                </ul>
             </li>
          </ul>
       </li>

    </ul>
</div>

 

<script>

$(document).ready(function() {
    var iCateNo = getQueryString('cate_no');
    if (!iCateNo){
        $('#cssmenu li.active').addClass('active').children('li').show();
        //$('#cssmenu li.has-sub3.active').addClass('active').children('li.has-sub2').show();
        return false;
    }
    var sFindString = 'cate_no='+iCateNo;

    $('#cssmenu li.has-sub>a').each(function() {
        var iIndex = $(this).attr('href').indexOf(sFindString);
        if (iIndex > -1) { 
            $(this).parent().addClass('active');
            //$(this).parent().hasClass('open');
            $(this).parent().find('li').removeClass('open');
            $(this).parent().find('ul').slideDown(350);
        }
    });


});


</script>

펼침메뉴 고정하기 질문드립니다.

답변 1개

공유하기