@wakenbyWork

Можно ли через pointer-events: none; прятать модальные окна?

Пишу для модальных окон обычно такой код:

.modal {
  transition: $transition-duration opacity $transition-timing-function;
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  height: 100%;
  width: 100%;
  opacity: 0; // Визуально скрываем
  pointer-events: none; // Предотвращает события мыши и щелчки по элементу.

  &--open {
    opacity: 1; // Показываем
    pointer-events: unset; // Разрешаем работать с окном
  }
}


Так удобно анимировать открытие и закрытие модального окна. Но видел что делают через visibility. Но анимацию закрытия с помощью visibility делать не так легко как с pointer-events.

Не подскажите есть ли преимущества в visibility в данном вопросе перед pointer-events?
  • Вопрос задан
  • 226 просмотров
Пригласить эксперта
Ответы на вопрос 1
delphinpro
@delphinpro Куратор тега CSS
frontend developer
pointer-events: none;

Это предотвратит любые взаимодействия с вашим окном. Но ведь это не то, чего вы хотите?
Ответ написан
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы