About loading images using masonry.js

Lately I've been writing a project that needs to load items like "pinterest". so I am using freemasonry - jquery plugin.

but the problem is that the plugin starts after all the images have loaded, because it needs to calculate the size of the elements and move them. which leads to a problem: if the images are not loaded, the plugin does not start and is not calculated correctly. does anyone have experience with it that can help me?

var $container = $('#tweetbox');

$container.imagesLoaded( function(){

  $container.masonry({

    itemSelector : '.each_tweet'

  });

  $('.fancy img').each(function(){

    var $this = $(this),

        url = $this.attr('alt');

    $this.attr('src',url);

  });

});

      

        
        
        
      

    

Thank!