Ichiban Ichiban - 10 days ago 6
CSS Question

zoom transition when the mouse is out of the image

I haven't found an answer, I have an image on my website and with

hover
I have a small zoom transition when my mouse is on the image but if the mouse is out, there is no transition
Is it possible to add a smooth transition to the initial position ?
If yes, how ?

Thanks

Answer

You need to add the transition to the element, and not the :hover.

img {
  height: 200px;
  transition: all 0.4s;
}
img:hover {
  transform: scale(1.2);
}
<img src="http://butlers-web.com/Content/Images/BW%20Logo%203.0.png" />