채택완료

영카트 첫화면 장바구니 버튼..

클릭하면 MY쇼핑 등등 내용이 나오는데요.

X 버튼을 클릭해야 닫히는데.. 배경이나 다른곳을 터치해도 창이 닫히도록 할 수 없을까요??
전문가의 도움 부탁드려요. 

|

답변 1개 / 댓글 1개

채택된 답변
+20 포인트

아래의 코드를 참고 해보시겠어요?

 

 

<script>
$(document).ready(function() {
    // 팝업 창의 배경을 클릭하면 닫기
    $(document).on('click', function(event) {
        var $target = $(event.target);

        // 팝업 창 이외의 영역 클릭 시 닫기
        if ($('.popup').is(':visible')) {
            if (!$target.closest('.popup, .cart-button').length) {
                $('.popup').hide();
            }
        }
    });

    // 장바구니 버튼 클릭 시 팝업 열기
    $('.cart-button').on('click', function(event) {
        event.preventDefault();
        $('.popup').show();
    });

    // X 버튼 클릭 시 팝업 닫기
    $('.close-button').on('click', function(event) {
        event.preventDefault();
        $('.popup').hide();
    });
});
</script>
 

<!-- 장바구니 버튼 -->
<button class="cart-button">장바구니</button>

<!-- 팝업 창 -->
<div class="popup" style="display:none;">
    <button class="close-button">X</button>
    <!-- 팝업 내용 -->
</div>
 

답변에 대한 댓글 1개

감사합니다^^

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