Warning: Undefined array key "mobile_dir" in /home/kagla/new-sir/old/common.php on line 315
토글 스크립트 버튼 두개로 하려면 어떻게 수정해야 할까요?

토글 스크립트 버튼 두개로 하려면 어떻게 수정해야 할까요?

토글 스크립트 버튼 두개로 하려면 어떻게 수정해야 할까요?

QA

토글 스크립트 버튼 두개로 하려면 어떻게 수정해야 할까요?

답변 1

본문

<span class="panelclose" alt="닫힘버튼></span>                    

<ul>

<li> 버튼1</li>

 <li class="q-btn2">버튼2</p></li>
 <div class="popup-content" style="display:none">   

 토글 내용이 뜨는 부분

<li> 버튼2</li>

<li> 버튼3</li>

</ul>

 

 

 

 

 

 

 

<script type="text/javascript">
    $(".popup-content").hide();
    $('.q-btn2').click(function() { 
    if($('.popup-content').hasClass("open")) {
            $('.popup-content').css("display","none");
            $('.popup-content').removeClass("open");
    }else{
            $('.popup-content').css("display","block");
            $('.popup-content').addClass("open");
    }
});
 </script>
    
    
<script type="text/javascript">    
    $(function(){    
    $(".panelclose").click(function(){
        $(".popup-content").hide();
        $(this).hide();
        });
});
 </script>

 

 

 

이 상태에서 클릭시 토글창이 사라지긴 하지만 (.q-btn2 이 버튼)으로 다시 열었을떄

(.panelclose 닫힘버튼) 이 이미 사라져서 보이지가 않네요~

열떄는 (.q-btn2 이 버튼) 로 열리지만 닫힐때는 (.q-btn2 이 버튼) 로도 닫히고

(.panelclose 닫힘버튼) 로도 두가지로 닫히게 했으면 좋겠어요. 감사합니다

이 질문에 댓글 쓰기 :

답변 1


<span class="panelclose" alt="닫힘버튼">닫힘버튼</span>                    
<ul>
<li> 버튼1</li>
 <li class="q-btn2">버튼2</li>
 <div class="popup-content" style="display:none">   
 토글 내용이 뜨는 부분
 </div>
<li> 버튼2</li>
<li> 버튼3</li>
</ul>
 
    
    
<script type="text/javascript">    
    $(function(){    
    
      $(".popup-content").hide();
      
    $('.q-btn2 , .panelclose').click(function() { 
    if($('.popup-content').hasClass("open")) {
            $('.popup-content').css("display","none");
            $('.popup-content').removeClass("open");
    }else{
            $('.popup-content').css("display","block");
            $('.popup-content').addClass("open");
    }
    })
    
 
});
 </script>
 
답변을 작성하시기 전에 로그인 해주세요.
QA 내용 검색
질문등록
전체 129,406
© SIRSOFT
현재 페이지 제일 처음으로