Blueberryware

This article is awesome for determining if a css background image has loaded. It uses a simple function to determine it, and even allows you to keep a “waiting for load” image before hand (essentially a background image preloader). I wanted to put it here because I am using it in the new OSX theme. There is a spinning gear progress bar while the large background image is resized for our screen resolution and then downloaded.

Here is the javascript we use for the OSX theme based on this article:

function preload(divID, divBackground) {
    var d = jQuery(divID);
    if(divBackground=="" || d==null) {noBG(divID); return;}
    var img = new Image();
    d.css({'background-image':'url("img/wait.gif")'});
    img.onload = function() {
        d.css({'background-image':'url("' + img.src + '")'});
        jQuery('#progress').empty();
    }
    img.src = divBackground;
}

Digg

Stumble Upon

Del.icio.us

Buzz