일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | 3 | 4 | |||
5 | 6 | 7 | 8 | 9 | 10 | 11 |
12 | 13 | 14 | 15 | 16 | 17 | 18 |
19 | 20 | 21 | 22 | 23 | 24 | 25 |
26 | 27 | 28 | 29 | 30 | 31 |
Tags
- 리눅스
- 복현오거리
- mysql
- 라즈베리파이2
- Rocky
- 가상서버호스팅
- 소비전력
- 알리익스프레스
- 보르비스초월
- 킹북이초월
- 티스토리
- jQuery
- 윈도우10
- ConoHa
- KB증권
- 알뜰폰
- OpenWrt
- 아파치
- KB국민카드
- 스톤에이지
- iptime
- 시놀로지
- centos
- SKT
- proxmox
- PHP-FPM
- Apache
- 램가스초월
- php
- 자바스크립트
- Today
- Total
맛집 여행 캠핑 일상 생활
DIV 팝업레이어 뒷쪽에 클릭이 안되게 처리 본문
728x90
DIV 팝업레이어 뒷쪽에 클릭이 안되게 처리
팝업레이어에 IFRAME 으로 파일을 불러들이지 않으면 레이어 뒤쪽으로 버튼이 있거나 하면 마우스클릭시 뒷쪽 이벤트가 먹힙니다.
이것을 CSS로 방지하는 방법입니다.
브라우저에 따라 안먹힐 수도 있습니다.
function action_PopupOpen(_layer) {
document.getElementById(_layer).style.display='block';
$('body').css("pointer-events","none");
}
function action_PopupClose(_layer) {
document.getElementById(_layer).style.display='none';
$('body').css("pointer-events","auto");
}
<div id="popupLayer">
<div style="position:absolute;top:0px;left:100%;margin-left:-20px;width:20px;height:20px;background-color:red;">
<img src="../images/close.png" style="cursor:pointer;" onclick="action_PopupClose('popupLayer');" alt="close">
</div>
팝업내용
</div>
위 코드를 응용하면 됩니다.
728x90
반응형
'HTML.CSS' 카테고리의 다른 글
[HTML/CSS] overflow-y 속성 (0) | 2018.10.18 |
---|---|
HTML/CSS 문자열이 특정폭 길이를 넘을때 (0) | 2018.10.02 |
HTML/CSS INPUT readOnly 효과 (0) | 2017.09.14 |
CSS 여러개의 클래스 중에 몇번째 이후만 다르게 적용 (0) | 2017.02.01 |
CSS IE 에서 스크롤바가 안나타나는 경우 (0) | 2017.01.17 |
Trackback : | Comments :