Не работает анимация в тильде

Question

Есть код, но анимация увеличения не работает, то есть изображение плавно увеличивается, но без плавности возвращается в первоначальное положение.

Как сделать так, чтобы вся анимация работала плавно?

<style>

   .tn-elem__1630375871470210224069{
    transition:  1s ease-out;
}


  .tn-elem__1630375871470210224069 :hover {
    opacity: 0.6;
    transform: scale(1.1);
}

</style>

Answer 1

Убрать пробел между классом элемента и :hover

.tn-elem__1630375871470210224069 :hover {

И заменить ease-out на ease-in-out.

Должно ваши потребности закрыть.

.tn-elem__1630375871470210224069{
    transition:  1s ease-in-out;
    width:150px;
    height:150px;
    background:#000;
    margin:auto;
}


  .tn-elem__1630375871470210224069:hover {
    opacity: 0.6;
    transform: scale(1.1);
}

<div class="tn-elem__1630375871470210224069">

</div>

БЛОГ НА HUSL

Не работает анимация в тильде

Ответы (1 шт):