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

show hide에서 바탕화면을 찍어도 닫히게 하는 방법이 있을까요? 채택완료

헛둘헛둘 2년 전 조회 1,270

버튼을 클릭하면 내용이 보여지고

버튼을 다시 클릭하면 내용이 사라지는 show()  / hide() 를 지금 쓰고 있어요

 

 

1.우선 버튼을 만들때 클래스를 줬고, 닫기는 display:none으로 처음에는 안보이게 했고

</p>

<p><button type="button" class="all_open">전체보기</button> 

<button type="button" class="all_close" style="display:none">전체닫기</button></p>

<p>

 

 

2.내용 들어가는곳은 id로 설정을 잡고 첨에는 안보이게 설정했고..

</p>

<p><div id="content"  style="display:none"></p>

<p>내용</p>

<p></div></p>

<p>

 

3. 스크립트 부분은 버튼을 클릭했을때 보여지고, 다시 재 클릭했을때 감춰지는걸 설정을 했는데요

        <script></p>

<p>        $(document).ready(function(){

            $(".all_open").click(function(){

                $(".all_close").show();

                $(".all_open").hide();

                $( '#content' ).toggle();

            });

            $("all_close").click(function(){

                $(".all_open").show();

                $(".all_close").hide();

                $( '#content' ).toggle();

            });

        });</p>

<p>        </script></p>

<p>

 

거의 정석대로 했다고 보시면 되는데...

여기서 버튼으로 닫는거 말고도....내용이 켜져있을때 바탕화면 아무곳이나 찍을때 닫히게 하려면

어떤식으로 스크립트를 써줘야할까요..

 

초보라서 검색을 해도 찾기가 어려운데..

마음같아선

div를 기준으로

div id="content 가 아닌곳을 찍게되면 닫히게 하는걸 추가하면 가능할거 같은데..

쌩초보라..어려움이 많아서 조언을 좀 얻어볼까 하고 글을 남겨봅니다

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

답변 1개

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

구글에 특정 영역 외 클릭으로 검색해보시면 몇 가지 방법들이 나옵니다. 참고해보시면 좋을거 같습니다.

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

답변에 대한 댓글 1개

헛둘헛둘
2년 전
오오 감사합니다
특정영역외 클릭 이란 단어로 검색이 되는군요 ㅠ.ㅠ 이게 생각이 안나서 엄청 헤맸습니다

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

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

로그인