CSS
,
Source
Edit
History

pointer-events를 이용한 클릭 방지 및 이벤트 위임

카탈로그
  1. 1. pointer-events

pointer-events

상위 요소에 있지만 클릭 못하게 하는 방법 + 이벤트 버블링 방지

1
2
3
4
5
6
7
8
9
10
11
12
event.preventDefault()
현재 이벤트의 기본 동작을 중단한다.

event.stopPropagation()
현재 이벤트가 상위로 전파되지 않도록 중단한다.

event.stopImmediatePropagation()
현재 이벤트가 상위뿐 아니라 현재 레벨에 걸린 다른 이벤트도 동작하지 않도록 중단한다.

return false
jQuery를 사용할 때는 위의 두개 모두를 수행한 것과 같고,
jQuery를 사용하지 않을 때는 event.preventDefault() 와 같다.

See the Pen 투명하지만 클릭못하는 DIV by taeuk_kang (@taeuk_kang) on CodePen.