arrow-left
Вернуться к продуктам
Кратко о видео
В уроке разобраны два значения pointer-events: auto (стандартное поведение — клики проходят к элементу) и none (клики проходят сквозь элемент, как будто его нет). На примере попапа: оверлей с pointer-events: none не блокирует клики на контент под ним. Pointer-events: none полезен в нескольких сценариях: декоративные оверлеи, элементы в абсолютном позиционировании над кнопками, отключение кликов на неактивные элементы. В Taptop параметр находится в разделе «Дополнительно» в правой панели. Урок короткий и точечный — полезен при первом столкновении с проблемой, когда кнопка не кликается из-за перекрывающего блока. Базовое понимание позиционирования и z-index поможет быстрее применить решение к своей задаче.

Как управлять кликами на элементах в Taptop — pointer-events

Оверлей на попапе перекрывает страницу — и кнопки под ним перестают работать. Или нужен декоративный элемент, который не реагирует на клики. Как решить это без кода?
Pointer-events — CSS-свойство: определяет, реагирует ли элемент на клики. Значение none делает элемент «прозрачным» для мыши, клики проходят насквозь. Чаще всего нужно для оверлея попапа, чтобы не блокировать всё под ним. Для всех. После просмотра управляешь поведением кликов на любом элементе через одно свойство.
Тайминги видео
00:00 — Что такое pointer-events и где найти в Taptop 00:25 — Значения: auto и none 00:50 — Попап блокирует страницу — ставим none на попап 01:20 — Возвращаем auto на контейнер с контентом

Другие продукты академии

Как выйти на фриланс
Разберётесь, как брать первые проекты, называть цену и общаться с клиентами
Для кого
Специалистов
Направление
Фриланс
Формат
Мини-курс
Длительность
13 уроков
Taptop с нуля: сайт-портфолио
Осваиваете базу Taptop и собираете сайт-портфолио, который можно оставить себе
Для кого
Новичков
Направление
Вёрстка
Формат
Мини-курс
Длительность
9 уроков
Как дизайнеру понять вёрстку
Разберётесь, как устроены сайты, чтобы увереннее работать с ними дальше
Для кого
Новичков
Направление
Вёрстка
Формат
Интенсив
Длительность
2 урока
Как собрать сложную анимацию
Собираете сложную анимацию и плавный переход между страницами
Для кого
Для тех, кто в теме
Направление
Анимации
Формат
Интенсив
Длительность
2 урока