preload hidden CSS images

Question

I\'m working on a jquery based homepage with 5 or so hidden divs, each containing several background css images.

The issue is that the browser doesn\'t load css ima

Answer 1

When you said other ways do you mean ones that don't use Javascript?

Other none JS ways are to place some html in your page somewhere so it's not seen:

or HTML...

...and CSS...

.hiddenPic {
    height:1px;
    width:1px;
}

More JavaScript Methods:

function preload(images) {
    if (document.images) {
        var i = 0;
        var imageArray = new Array();
        imageArray = images.split(',');
        var imageObj = new Image();
        for(i=0; i<=imageArray.length-1; i++) {
            //document.write('');// Write to page (uncomment to check images)
            imageObj.src=images[i];
        }
    }
}

Then load the images using something like: