Home/ Questions/Q 8147027
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-06-06T14:12:29+00:00

I’ve got a background image that changes to another image when :hover. I used

  • 0
  1. I’ve got a background image that changes to another image when :hover.
  2. I used transition to show this effect.
  3. When transition finishes my old image reapears using the same transition when loses focus (Not hover).

Please see a working example (use chrome) :
http://jsfiddle.net/WZqrY/3/

My problem:
The second transition effect does not apears when I take out the mouse half way into the first transition. You can try this moving the mouse into the image for one second and then moving it out of the image. How can I make this go smoothly?

Note: When I use colors instead of an image this effect does work in the way I pretend.

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    The background image transitions seem to be an unplanned “side effect” that’s not fully functional and have a very limited support amongst the browsers

    “This only works on Chrome 18+ and on Webkit Nightlies built in 2012 onwards. It seems to be a side effect of the CSS4 crossfading work” – source

    For now your better bet will be the “2 images in a container” solution – http://jsfiddle.net/WZqrY/4/

    This will work in all browsers that support transitions.

    • 0