imagesLoaded方法不与JQuery砌筑和无限滚动

Question

我一直在使用JQuery砌体，现在我添加无限滚动。几乎每个砌体砖都有图像，在我使用无限滚动之前，图像加载得很好，一切都很好。我为无限滚动添加了javascript的下一部分，并在里面添加了imagesLoaded方法，但是当新砖块被追加时，它们都会堆积在顶部。我的假设是，我没有在无限滚动回调中正确添加imagesLoaded方法，但我一直无法找到我的错误。这里是代码

<script type="text/javascript"> 
    $(function(){ 
     var $container = $('#container'); 
     $container.imagesLoaded(function(){ 
      $container.masonry({ 
      itemSelector : '.tile', 
      columnWidth : 240 
      }); 
     }); 


    var $container = $('#container'); 
    $container.infinitescroll({ 
     navSelector : ".flickr_pagination",    
         // selector for the paged navigation (it will be hidden) 
     nextSelector : "a.next_page",  
         // selector for the NEXT link (to page 2) 
     itemSelector : "div.tile"   
         // selector for all items you'll retrieve 
     }, 
     // trigger Masonry as a callback 
     function(newElements) { 
     var $newElems = $(newElements); 

     $container.imagesLoaded(function() { 
      masonry('appended', $newElems); 
     }); 
     } 
    ); 
    }); 
</script> 

第一个JQuery石工调用工作正常，并没有被触及。这是看起来有问题的第二部分。感谢您的帮助，并让我知道您是否需要更多信息。

Answer 1

这里的答案

$(function(){ 

     var $container = $('#container'); 
     $container.imagesLoaded(function(){ 
      $container.masonry({ 
      itemSelector : '.tile', 
      columnWidth : 240 
      }); 
     }); 

    $container.infinitescroll({ 
      navSelector : '.flickr_pagination', // selector for the paged navigation 
      nextSelector : 'a.next_page', // selector for the NEXT link (to page 2) 
      itemSelector : '.tile',  // selector for all items you'll retrieve 
      loading: { 
       finishedMsg: 'No more pages to load.', 
       img: 'http://i.imgur.com/6RMhx.gif' 
      } 
      }, 
      // trigger Masonry as a callback 
      function(newElements) { 
      // hide new items while they are loading 
      var $newElems = $(newElements).css({ opacity: 0 }); 
      // ensure that images load before adding to masonry layout 
      $newElems.imagesLoaded(function(){ 
       // show elems now they're ready 
       $newElems.animate({ opacity: 1 }); 
       $container.masonry('appended', $newElems, true); 
      }); 
      } 
     ); 
    }); 

问题是我打电话.imagesLoaded（）在$容器的无限滚动回调函数，我应该一直在呼吁它$ newElements。