보관함

즐겨찾기

좋아요

최근목록

커뮤니티

건강/의학

문화/엔터

영상/사진

쇼핑/생활

경제/금융

IT/과학

스포츠

여행

음식/요리/맛집

유아/아동

교육/학습

어플/프로그램

유튜브

카페

블로그

자료/파일/문서공유

기타

비즈니스/사업

SNS

자동차

전체보기

전체개요

회사명 : 모아요넷

대표자 : 전현미

E-Mail : help@moayo.net

조회수:1,297

jquery 활용해 버튼클릭시 레이어창이 뜨고 다른 배경 클릭할때 뜬 레이어 창 닫게 하는

0

https://www.moayo.net/p-moayo-21028 (짧은주소)

#레이어창닫기

#모달창닫기

#배경클릭시

레이어창이 뜬상태에서 배경을 클릭하면 레이어 창을 닫는 jquery 입니다

배경클릭시 레이어 창을 닫는 방법입니다

일반적으로 레이어 창이 뜨면 배경 아무곳을 클릭하여 제거하려는 습관이 있습니다

배경을 클릭했는데 떠있는 레이어모달창이 닫히지 않으면 참 난감할때가 있습니다

이런걸 방지하기 위해 배경클릭시 모달창을 닫게 하는 이벤트를 추가해 놓으면 유용합니다

click_hide.html

<button type="button" class="bg_click_modal_btn" onclick="$('#modal_layer').show();">레이어 창 열기</button>
<div class="bg_click_modal_none" id="modal_layer" style="display: none;">
  레이어 내용1
</div>


<script>
$(document).ready(function() {
  $(document).on('click', function(event) {
    if($(event.target).hasClass('bg_click_modal_btn')){//노출버튼을 클릭하는경우
    }else{//다른곳을 클릭하는경우
      if ($(event.target).hasClass('bg_click_modal_none')) {
        event.stopPropagation();
      } else {
        $('.bg_click_modal_none').hide();
      }
    }
  });
});
</script>

유사한정보

웹상에서 화면 캡쳐하는 플러그인 jquery 화면캡쳐 html화면캡쳐 html2canvas 플러그인 프로그램

웹상에서 화면 캡쳐하는 플러그인

html2canvas.hertzen.com

html화면을 자바스크립트로 캡쳐하는 플러그인 입니다

#html화면캡쳐

0

웹상에서 화면 캡쳐하는 플러그인

html2canvas.hertzen.com

html화면을 자바스크립트로 캡쳐하는 플러그인 입니다

#html화면캡쳐

0

jquery jquery ui 데모 api

jqueryui는 jquery의 API 뿐아니라 다양한 UI 데모와 소스를 제공해 쉽게 jquery를 사

0

jqueryui는 jquery의 API 뿐아니라 다양한 UI 데모와 소스를 제공해 쉽게 jquery를 사

0

jquery 자바스크립트 jquery

jquery는 자바스크립트를 편리하게 사용할수 있도록 만들어진 라이브러리 입

#자바스크립트

0

jquery는 자바스크립트를 편리하게 사용할수 있도록 만들어진 라이브러리 입

#자바스크립트

0