jQuery isotope on first load doesn't work, How do I wait for all resources/images to be loaded?

Question

I\'ve got something I\'ve put together using jQuery isotope here.. http://jsbin.com/eziqeq/6/edit

It seems to work in general but on first load, of a new tab, the Is

Answer 1

Quick pure JavaScript example to check if all imagery has loaded before initialising the isotope library.

jQuery(document).ready(function($){
    var imgs = document.images,
        len = imgs.length,
        counter = 0;

    [].forEach.call( imgs, function( img ) {
        if(img.complete)
          incrementCounter();
        else
          img.addEventListener( 'load', incrementCounter, false );
    } );

    function incrementCounter() {
        counter++;
        if ( counter === len ) {
            // All images loaded, go ahead.
            var $grid = $('.grid').isotope();
        }
    }
});