I have an <a href=""></a> which has a CSS background image. In CSS, I have the :hover pseudo class to change the background-position.
I would like to fadeIn and fadeOut the two different backgroundimages with jQuery. I do not want to animate the backgroundposition, but fadeIn and fadeOut two different CSS classes.
Is this possible? Or do I need another approach?
This is not possible purly in jQuery. You can, however, take a look at jQuery UI for this purpose (not sure it works either).
See http://jqueryui.com/
Another solution is, as the other answers says, to overlay two divs and animate the opacity.