html.okpython.net
HTML и CSS для начинающих

CSS :: Свойство pointer-events

css-свойство pointer-events (от англ. pointer eventsсобытия указателя) позволяет контролировать процесс реагирования элемента на события мыши или прикосновения к сенсорному экрану над ним (например, можно заблокировать переход при клике по ссылке или появление подсказки при наведении на элемент с атрибутом title).

Характеристики

  • Значение по умолчанию: auto.
  • Применяется: ко всем элементам.
  • Наследуется: да.
  • Анимируется: нет.
  • JavaScript: object.style.pointerEvents="value".

Синтаксис

pointer-events: auto | none

Значения

  • auto – элемент будет реагировать как обычно.
  • none – события мыши над элементом будут игнорироваться.

Ссылки

Примеры

HTML Результат htmlCodes
<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">  
	<title>Пример №1</title>

	<style>
				
		p{
		width: 400px;
		height: 50px;
		padding: 2em;
		background-color: yellow;
		cursor: pointer;
		}

		/* Запрещаем события мыши над элементом */
		.events_none{
		background-color: violet;		
		pointer-events: none;
		cursor: auto;		
		}		
	 
	</style>
	
</head>
<body>

	<p onclick="event.currentTarget.innerHTML='Клик прошел!'">
		Реакция на клик будет обычной.         
	</p>

	<p class="events_none">
		Реакция на клик будет отсутствовать.      
	</p>
			
</body>
</html>

Пример №1