Php 同位素+Wordpress-加载后重新布局？

我在WordPress中使用的是带有砖石结构布局的同位素，还有图像。每个帖子都是一个单独的同位素项目。除了我在帖子中加载一些动态的东西，比如推特小部件或嵌入式视频，所有这些似乎都工作得很好。项目的初始高度在post/小部件加载之前设置。一旦它完全加载，我需要重新布局，以适应新的高度

是否有一种方法可以在所有帖子完全加载后再次调用布局函数

这是我的同位素代码：

// init isotope
var $container = $('#cards');

$container.isotope({
    itemSelector: '.item',
    masonry: {
       columnWidth: '.grid-sizer',
       isFitWidth: true
    }
});


// layout Isotope again after all images have loaded
$container.imagesLoaded( function() {
  $container.isotope('layout');
});  


// infinite scroll
$container.infinitescroll({
        navSelector  : '.pagination',   
        nextSelector : '.pagination a', 
        itemSelector : '.item-scroll', 
        behavior: "twitter",
        loading: {
            finishedMsg: 'No more pages to load.'      
          }
        },     
        function ( newElements ) {
          var $newElems = jQuery( newElements ).hide(); // hide to begin with
          // ensure that images load before adding to masonry layout
          $newElems.imagesLoaded(function(){
            $newElems.fadeIn(); // fade in when ready
            $container.isotope( 'appended', $newElems );  
          });
        }    
      );

function onLayout() {
        $container.infinitescroll('scroll');
  }

谢谢你的帮助

试试这个：

 var $container = $('#cards');
$container.imagesLoaded( function() {
  // init isotope

$container.isotope({
itemSelector: '.item',
masonry: {
   columnWidth: '.grid-sizer',
   isFitWidth: true
}
});
});  


// infinite scroll
$container.infinitescroll({
    navSelector  : '.pagination',   
    nextSelector : '.pagination a', 
    itemSelector : '.item-scroll', 
    behavior: "twitter",
    loading: {
        finishedMsg: 'No more pages to load.'      
      }
    },     
    function ( newElements ) {
      var $newElems = jQuery( newElements ).hide(); // hide to begin with
      // ensure that images load before adding to masonry layout
      $newElems.imagesLoaded(function(){
        $newElems.fadeIn(); // fade in when ready
        $container.isotope( 'appended', $newElems ).isotope('layout');  
      });
    }    
  );

function onLayout() {
    $container.infinitescroll('scroll');
}

---

这对布局问题没有任何影响。我认为ImagesLoaded只处理图像，我处理的是动态高度小部件、响应视频嵌入、twitter提要等等。注意：我必须移动var$container=$‘cards’；在函数之前定义$container。谢谢你的帮助。你正在使用同位素v2吗？是的，确切地说是2.0.1。JSFIDLE或链接会有所帮助