Блог Дмитрия Рыбалка

Свойство pointer-events в Тильде

Zero Block

Знаете за что отвечает свойство pointer-events в Тильда Zero Block?


pointer-events: auto — включает взаимодействие с мышью (по умолчанию)
pointer-events: none — выключает взаимодействие элемента с мышью (наведение и клик)


На примере две плитки. Слева у текста «Travel Tumbler» свойство pointer-events: none (выключено), справа auto (включено). Слева при наведении на любую часть плитки мышка не будет реагировать на текст и ссылка плитки остается активной, а справа при наведении мышкой на текст, этот текст становится активным и ссылка пропадает.

Когда мне нужно добавить плитку с активной ссылкой и поверх разместить другие элементы, я у этих элементов ставлю режим pointer-events: none, чтобы при наведении на них мышкой ссылка на плитке все равно становилась активной.

Пользуйтесь👋!