jQuery: Preloading a set of images, but only if nothing else loads

Is it possible with jQuery to identify if the browser currently isn't loading anything, and with anything I mean both loading images and .load Ajax calls etc.

The thing I would like to achieve is to secretly (hidden) preload a set of images (heavy in weight) in the background, but without distracting the other load processes. Meaning they will only preload if the browser have nothing else to do, 开发者_C百科and also stop preloading if something else starts to load..

Any suggestions?

Have a look at Ajax Events, in particular the ajaxStop global event. As for knowing when an image has finished loading, the load event can be used. For example:

$("#myImage").load(function() {
    alert("image has completely loaded!");
});

To put those together:

$("selector").ajaxStop(function(event,request,settings){
    var $img = $('<img src="foo.jpeg" id="myImage"/>');
    $img.load(function() {
        alert("image has completely loaded!");
        $("div").append($(this));
    });
});