pointer-events

by yejin_yang

HTML

<html>
<head>


</head>
<body>
  <div id='parent'>
    parent
    <div id='child'>
      child
    </div>
  </div>

</body>
</html>

CSS

#parent{
  height: 100px;
  width: 100px;
pointer-events: none;
  background: red;
}
#child{
  height: 60px;
  width: 60px;
  pointer-events: auto;
  background: blue;
}

JavaScript

const child = document.querySelector("#parent");
child.addEventListener('click', () =>  alert('hi'));