Question: I am trying to get a callback function to execute when jQuery Masonry has done its positioning magic, preventing a flash of unstyled content in my code.

For the purpose of testing, though, I am using a simple alert that isn't called at all.

```
var $jigsaw = $('#jigsaw');

$jigsaw.imagesLoaded( function(){
    $jigsaw.masonry({
     columnWidth : 180,
      isAnimated : !Modernizr.csstransitions,
     isResizable : true,
    itemSelector : '.piece'
    }, function(){
        alert('Completed');
    });
});

```

I may be missing something obvious, but any help would be appreciated

Answer: 
It looks like Masonry works with jQuery's deferred objects system. If you're using jQuery 1.5+ this might work:

```
$.when($jigsaw.masonry(options)).then(function(){/*callback function*/});

```
```
// Create the callback function
var callback = function($el, cb) {
  var instance = $.data($el, 'masonry');
  if (!instance) {
    setTimeout(callback($el, cb), 300);
  } else {
    cb();
  }
}

// Then simply add this to your imagesLoaded for an element of '.thumbnails' or something
callback('.thumbnails', function() {
  // some code goes here
});

```