@kroha3000

Анимация появление/исчезновение блока, как сделать?

Подскажите как сделать плавное появление блока, по середине страницы.

через opacity:0; - работает не корректно, то есть как бы область остаётся, хотя и не видимая, таким образом блокирует другие элементы

через display:none; - работает так как надо, но без анимации.

Как быть?
  • Вопрос задан
  • 4242 просмотра
Решения вопроса 1
freislot
@freislot
Frontend-разработчик

В начальном состоянии блоку дать z-index: -1; Когда добавляете класс active дописать opacity: 1 и z-index: 1 например. https://jsfiddle.net/u20cdL3g/
Ответ написан
Пригласить эксперта
Ответы на вопрос 1
@kroha3000 Автор вопроса
Пробовал так же через
overflow:hidden; + opacity:0;
и при исчезновении делаем размер блока в 1px убираем в угол, или за пределы экрана. Но тогда появление блока, именно анимация, происходит от того места, куда блок убрали. А требуется, плавное появление в центре экрана.
Ответ написан
Ваш ответ на вопрос

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

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