Fading between background images (jQuery)?

Soldato
Joined
27 Dec 2005
Posts
17,296
Location
Bristol
I'm trying to fade through different background images of a div. Is this possible?

I'm using a background image because it's a fixed, full-screen image and sliders can't seem to handle this well, especially with different sized images.

I've got as far as fadeOut to the background and then fadeIn, but is it possible to do a cross dissolve?
 
Associate
Joined
21 May 2013
Posts
1,991
Not possible with using the background-image property of a single element (at least, not without an extremely convoluted method).

For a cross-dissolve, both images are partially visible while the transition is in progress. An alternative would be to have two images positioned absolutely on top of each other, one fully opaque one fully transparent then invert the opacity of each.
 
Back
Top Bottom