jquery background image fade
- by Nick
I am using jQuery to load ina background image that fills the page width / height. I have the following in the Head:
$(document).ready(function() {
$('body').css({
'background-image' : 'url({HTML_BASE}images/backgrounds/randoms/{BACK_IMG})',
'background-repeat' : 'no-repeat',
'background-position' : 'center top',
'background-attachment': 'fixed',
'background-size': '100% 100%',
});
$('#home-promo').innerfade({
speed: 'slow',
timeout: 5000,
type: 'sequence',
containerheight: 'auto'
});
$('.model-search').innerfade({
speed: 'slow',
timeout: 5000,
type: 'sequence',
containerheight: '393'
});
});
This works fine and can be seen at http://projects.snowshtechnologies.com/golden_dragon/home/
I want the BG image to fade in from the black background colour. I have looked at a few other threads on Stack that suggest its not possible as a body element defined in css, but in this scenario the BG image is being loaded in by jQuery. How would I go about adding a fade in to this code to bring the image in with a nice fadein?