테스트 사이트 - 개발 중인 베타 버전입니다

모바일 슬라이딩 메뉴 스크립트 질문드립니다. 채택완료

다나한포션 3년 전 조회 4,396

안녕하세요.

모바일에서 아래로 펼쳐지는 슬라이딩 메뉴를 구현하고 있습니다.

전혀 반응이 없는데 뭐가 잘못된건지 모르겠습니다...

스타일시트에서 display:none을 끄면

슬라이드업은 또 되네요..ㅠ

안보이는 상태에서 누르면 내려가면서 보여야 하는데 말이죠...

고수님들 도움 부탁드립니다....ㅠ

 

</p>

<p><style></p>

<p>.gnb dl {display:none}</p>

<p></style></p>

<p><div class="gnb">

 <ul>

  <li>  </p>

<p>   <h4>테스트메뉴</h4><i class="fa fa-chevron-down ico_ar"></i>

   <div>

    <dl>

     <dt><a href="<?php echo G5_URL?>/content/1/">테스트메뉴1</a></dt>

     <dt><a href="<?php echo G5_URL?>/content/2/">테스트메뉴2</a></dt>

    </dl>

   </div>

  </li>

</div>    </p>

<p> </p>

<p><script>

$(function(){

$(".gnb h4").click(function(){

$(".gnb ul dl").slideUp();

$('.ico_ar').css('transform','none');

if(!$(this).next().is(":visible"))

{

$(this).next().slideDown();

$(this).find('.ico_ar:eq(0)').css('transform','rotate(180deg)');

}

})

})

</script></p>

<p>

댓글을 작성하려면 로그인이 필요합니다.

답변 1개

채택된 답변
+20 포인트
3년 전

</p>

<p><script>

$(function() {

    $(".gnb h4").on('click', function() {

        let $dl = $(this).parent().find('dl');

        

        if ($dl.is(":visible")) {

            $dl.slideUp();

            $(this).parent().find('.ico_ar').css('transform','none');

        } else {

            $dl.slideDown();

            $(this).parent().find('.ico_ar').css('transform','rotate(180deg)');

        }        

    });

});

</script></p>

<p>

로그인 후 평가할 수 있습니다

답변에 대한 댓글 1개

다나한포션
3년 전
와... 감사합니다!

댓글을 작성하려면 로그인이 필요합니다.

답변을 작성하려면 로그인이 필요합니다.

로그인