CSS3 background image transition

Question

I\'m trying to make a \"fade-in fade-out\" effect using the CSS transition. But I can\'t get this to work with the background image...

The CSS:

Answer 1

This can be achieved with greater cross-browser support than the accepted answer by using pseudo-elements as exemplified by this answer: https://stackoverflow.com/a/19818268/2602816