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

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

QA

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

본문

<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>
 
답변을 작성하시기 전에 로그인 해주세요.
전체 14
QA 내용 검색

회원로그인

(주)에스아이알소프트 / 대표:홍석명 / (06211) 서울특별시 강남구 역삼동 707-34 한신인터밸리24 서관 1404호 / E-Mail: admin@sir.kr
사업자등록번호: 217-81-36347 / 통신판매업신고번호:2014-서울강남-02098호 / 개인정보보호책임자:김민섭(minsup@sir.kr)
© SIRSOFT