Можно ли сделать прозрачный для нажатий фон?

246

24 апреля 2017, 01:52

Пытаюсь сделать игру, когда надо находить блоки, а поверх фон потихоньку все темнел и темнел. Следовательно нужно, чтобы верхний слой был прозрачным для нажатий, но его вид можно было бы менять. А нижний слой работал бы как обычная html страница.

Answer 1

Можно использовать pointer-events: none; для фона:

.background { 
  background-color: #f80; 
  height: 100%; 
  opacity: .5; 
  pointer-events: none; 
  position: absolute; 
  width: 100%; 
} 
 
a { 
  display: inline-block; 
  margin: 24px; 
}

<div class="background"></div> 
<a href="#" onclick="alert('Click')">Click</a>

Answer 2

Можно, для этого задайте pointer-events: none;

Данное значение "скроет" элемент от событий мыши, хотя его потомки могут быть видны для них.

The element is never the target of mouse events; however, mouse events may target its descendant elements if those descendants have pointer-events set to some other value