title: Fade in images as they load isotope?
body: <p>I have isotope portfolio set up on my website (which you can view through my profile) and I want to fade in the images of the isotope gallery as they load as shown here: <a href="http://cameronspear.com/demos/jquery-image-fade-in-on-load/" rel="nofollow noreferrer">http://cameronspear.com/demos/jquery-image-fade-in-on-load/</a> (example).</p>
  
  <p>I tried using imagesLoaded like on this question but it didn't work: <a href="https://stackoverflow.com/questions/15177919/isotope-display-gallery-after-images-loaded">Isotope display gallery after images loaded</a></p>
  
  <p>Also here's a jsfiddle with the method mentioned in the comments (not isotope):
  <a href="http://jsfiddle.net/9z2u2xtk/" rel="nofollow noreferrer">http://jsfiddle.net/9z2u2xtk/</a> (doesn't seem to work good if more than 5 images are to load)</p>
  
  <pre><code>$pfcontainer.imagesLoaded(function(){  
  $pfcontainer.fadeIn(1000).isotope({
          getSortData : {
              number : function( $elem ) {
              return parseInt( $elem.find('.number').text(), 10 );
            },
        },
      sortBy : 'number',
          filter: '.designs',
          animationOptions: {
              duration: 750,
              easing: 'linear',
              queue: false,
          }
      });
  });
  </code></pre>