So basically my question is: does anyone know how to cross-fade when changing an elements css background-image property?
I suggest two layers.
We're only going to create the illusion of a crossfade.
Step one: Layer 1 (nivo slider) fades the new background in. After it's done fading it, the background is moved to Layer 2 and removed from layer 1. The user won't see the switch as it's instantaneous.
Step two: On the next transition, fade layer 2 out while layer 1 is fading in with the new background. Once this is done, switch the background from layer 1 to layer 2, turn layer 2 to opacity 100% and remove the background from layer 1. Again, the client-side will not see the visually switch as the appearance will look the same to them.
Rinse and Repeat.