@Breeze1

Как плавно закрыть меню?

Ребят, ступор небольшой. По клику меню плавно появляется, анимируется opacity. Нужно чтобы оно также плавно исчезало, а не резко обрывалось

https://codepen.io/brezze/pen/gZpypX
  • Вопрос задан
  • 59 просмотров
Решения вопроса 1
visibility: hidden срабатывает первым. Поэтому исчезает. А анимация работает на opacity

Можете на него задержку добавить.

.menu-wrap {
position: fixed;
width: 100%;
height: 100%;
visibility: hidden;
opacity: 0;
transition: opacity 1s ease, visibility 0s linear 1s;
z-index: 100;
}

.menu-wrap.open {
visibility: visible;
opacity: 1;
transition: opacity 1s ease;
}

https://codepen.io/anon/pen/GPJLWQ

Или можете вместо скрытия через visibility: hidden, использовать pointer-events: none;
Ответ написан
Пригласить эксперта
Ваш ответ на вопрос

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

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