У меня есть блок, внутри которого есть картинка и описание, которое первоначально скрыто. При наведении на картинку блок должен плавно появится из disblay: none
. Я пыталась реализовать это так, но у меня не получилось. Притом без использования keyfraymes
все работает. Либо, если анимация при наведении идет на саму картинку. Возможно ли это сделать без JS?
.achievements-container__img{
width: 40px;
height: 40px;
}
.achievements__description{
disblay: none;
}
.achievements-container__img:hover + .achievements__description{
animation: 1s show;
}
@keyframes show {
0% {
display: block;
opacity: 0;
}
100% {
display: block;
opacity: 1;
}
}