show hide에서 바탕화면을 찍어도 닫히게 하는 방법이 있을까요?
본문
버튼을 클릭하면 내용이 보여지고
버튼을 다시 클릭하면 내용이 사라지는 show() / hide() 를 지금 쓰고 있어요
1.우선 버튼을 만들때 클래스를 줬고, 닫기는 display:none으로 처음에는 안보이게 했고
<button type="button" class="all_open">전체보기</button>
<button type="button" class="all_close" style="display:none">전체닫기</button>
2.내용 들어가는곳은 id로 설정을 잡고 첨에는 안보이게 설정했고..
<div id="content" style="display:none">
내용
</div>
3. 스크립트 부분은 버튼을 클릭했을때 보여지고, 다시 재 클릭했을때 감춰지는걸 설정을 했는데요
<script>
$(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();
});
});
</script>
거의 정석대로 했다고 보시면 되는데...
여기서 버튼으로 닫는거 말고도....내용이 켜져있을때 바탕화면 아무곳이나 찍을때 닫히게 하려면
어떤식으로 스크립트를 써줘야할까요..
초보라서 검색을 해도 찾기가 어려운데..
마음같아선
div를 기준으로
div id="content 가 아닌곳을 찍게되면 닫히게 하는걸 추가하면 가능할거 같은데..
쌩초보라..어려움이 많아서 조언을 좀 얻어볼까 하고 글을 남겨봅니다
답변 1
구글에 특정 영역 외 클릭으로 검색해보시면 몇 가지 방법들이 나옵니다. 참고해보시면 좋을거 같습니다.
오오 감사합니다
특정영역외 클릭 이란 단어로 검색이 되는군요 ㅠ.ㅠ 이게 생각이 안나서 엄청 헤맸습니다
답변을 작성하시기 전에 로그인 해주세요.
