Buenos días/tardes/noches gente de StackOverflow.
Estoy trabajando en un código de CSS e hice unas transiciones de tipo translate de forma que cuando les coloco el cursor (es decir, que se activa el :hover) se muevan hacia arriba tardando 0,75s en completarse la transición, pero cuando quito el cursor de encima vuelven de forma brusca a sus posiciones originales. ¿Cómo hago que también sea gradual la transición de vuelta?
Aquí el código en cuestión:
.product-img-1:hover, .product-img-2:hover, .product-img-3:hover, .product-img-4:hover, .product-img-5:hover {
-webkit-transform: translateY(-3px);
-moz-transform: translateY(-3px);
-ms-transform: translateY(-3px);
-o-transform: translateY(-3px);
transform: translateY(-3px);
-webkit-transition-duration: 0.75s;
-moz-transition-duration: 0.75s;
-ms-transition-duration: 0.75s;
-o-transition-duration: 0.75s;
transition-duration: 0.75s;
}
Espero que me puedan ayudar. Un saludo y gracias de antemano.