Свойство pointer-events
Свойство pointer-events позволяет контролировать события, при которых элемент может стать объектом события мыши (нажатие, перетаскивание), так же может влиять на вид курсора, находясь внутри элемента, при определенных значениях.
pointer-events: none;
Пошаговый план! Как быстро научиться создавать сайты!
- поддерживается начиная с
- частичная поддержка до
- не поддерживается
Значения
pointer-events: auto;
Обычное поведение, как если бы pointer-events не был указан. Полезен когда родительскому элементу задан pointer-events: none; а дочерние элементы должны вести себя как обычно
<a class="example-1" href="#">Обычная ссылка</a>
<style>
.example-1 {
pointer-events: auto;
}
</style>
pointer-events: none;
Элемент не может быть целью событий мыши, но его дочерние элементы могут, если их pointer-events имеет какое-либо другое значение, например auto
<a class="example-2" href="#">Ссылка которая не реагирует на события мыши и вид курсора будет обычный</a>
<style>
.example-2 {
pointer-events: none;
}
</style>
pointer-events: none; и pointer-events: auto;
<a class="example-3" href="#">Ссылка, <span>часть которой</span> будет вести себя как обычно</a>
<style>
.example-3 {
pointer-events: none;
}
.example-3 span {
color: black;
pointer-events: auto;
}
</style>