I have a working code that changes my document background image when links in my navbar are clicked. The background image changes instantly with no animation. How could I make the new background image fadeIn(); ?
js
$('.navigation a').click(function() {
currentBg = $(this).attr('href').replace('#', '') +'.jpg';
$('.background').css({'background-image':'url(images/skins/'+currentBg+')'});
});
I don’t believe you can, the only way (that I know of) would be to have a block element (div for example) which has the background and that appears behind the rest of your content (positioned absolutely) and fade that in instead of switching backgrounds.