Arquivo Discussoes de Programacao e Tecnologia Tenho esse :hover aqui…
.novidades{ background-color: #F5dcdc; background-color: #f5dcdc; background: linear-gradient(#f5dcdc, #bebef4); position: relative; bottom: 0; } .novidades:hover{ bottom: 20px; transition: bottom 0.4s ease; }
como eu faço pro block .novidades voltar em animação ease pro mesmo lugar, ao invés de ser “teletransportado” pro lugar original ?
Boa noite, amigo.
Com “teletransportado pro lugar original” você quis dizer fazer transição de volta pro estado original? Se for isso, basta repetir o código da transição na classe que não possui a pseudo-classe “:hover”.
<em>.novidades{</em>
<em>background-color: #F5dcdc;</em>
<em>background-color: #f5dcdc;</em>
<em>background: linear-gradient(#f5dcdc, #bebef4);</em>
<em>position: relative;</em>
<em>bottom: 0;</em>
<strong>transition: bottom 0.4s ease;</strong>
<em>}</em>
<em>.novidades:hover{</em>
<em>bottom: 20px;</em>
<em>transition: bottom 0.4s ease;</em>
<em>}</em>
Você pode alterar o efeito pra ser o inverso (top), ou o que preferir.
Abraço.