Fedreg Fedreg - 3 months ago 12
CSS Question

Css transition in quickly, out quickly

This seems really basic but I couldn't figure it out. Is there a simple CSS only way to do cssa really quick fade in and a slow fade out. This is for changing color on multiple divs. About a .5 sec ease-in and a 2sec ease-out.

Thanks!

Answer

You just change the transition-duration on the active state, for example:

div {
  font-size: 16px;
  font-weight: bold;
  color: red;
  
  transition: all 5s;
}

div:hover {
  color: green;
  
  transition-duration: 0.5s;
}
<div>Hover over me to change the color</div>

Comments