Home/ Questions/Q 8008325
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-06-04T18:06:08+00:00

I have a custom animation in CSS3 which I can transition into view, but

  • 0

I have a custom animation in CSS3 which I can transition into view, but I cannot transition it out. Take a look at my Fiddle here: http://jsfiddle.net/spryno724/SW8Ly/. Note that this transition is only working in Webkit browsers as of now.

Try rolling your mouse over the styled text input. The background transitions from white into a blueish color when you roll your mouse over the text field, but it does not transition from blue to white.

I thought the ease-in-out property would take care of this, but it appears only to do so for pre-defined animations.

How can I transition from blue to white on mouse out?

Thank you for your time.

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    Why not use the default (-webkit-)transition method? Doesn’t seem you want to do something strange at all. Just look to this jsfiddle: http://jsfiddle.net/savver/SW8Ly/2/

    See this for the effects: http://www.css3.info/preview/css3-transitions/ Just scroll down and you’ll see what every property does.

    • 0