Question

$(window).load(...

waits for EVERYTHING on in the window to load. Which is great. But recently I have very much desired for an event to fire at a specific point in the page’s load. For example, ‘everything BUT images’.

I wish I could list my failed attempts, but I don’t know where to begin or even if such a thing is possible.

Something like:

$(window).partialLoad({
    exclude : 'jpg, png, gif'
}, function(){
    //do something when page has fully loaded except for images
});

or conversely

$(window).partailLoad({
    waitFor : 'woff, eot'
}, function(){
    //do something after all woff and eot files have loaded
});

If its possible I will write a nice plugin to handle it. Can anyone point me in the right direction as to how I might accomplish this?

Answer 1

Making the assumption that $(window).load() waits for all linked resources to download, we could write your own, assuming that without images, that would be iframe[src], script[src], link[rel="stylesheet"] etc.

var items = $('iframe[src], link[rel="stylesheet"], script[src]'),
    itemsLength = items.length;

items.load(function() {
    --itemsLength;

    if ( ! itemsLength) {
        // All loaded!
    }

});