@uroot

Как сделать анимацию при потере фокуса?

Есть следующая конструкция: песочница
При hoverdiv подменю меняется с display: none; на display: block; и срабатывает анимация:
animation: slide-top 0.3s ease-in-out both;
@keyframes slide-top {
    0% {
       transform: translateY(30px);
       opacity: 0;
    }
    100% {
       transform: translateY(0);
       opacity: 1;
       }
    }

Но она работает только при наведении, а при потере фокуса нет, как это исправить?
  • Вопрос задан
  • 548 просмотров
Решения вопроса 1
Get-Web
@Get-Web Куратор тега CSS
Front-End Developer
С display: none; обратную анимацию вы не сделаете, а вот с visibility: hidden; и transition повторить это легко:

Ответ написан
Комментировать
Пригласить эксперта
Ваш ответ на вопрос

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

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