JQuery Masonry不刷新容器高度

使用Jquery Masonry工作正常。但是我有一個小問題。佈局的樣子：JQuery Masonry不刷新容器高度

$('.container').masonry ({   
    itemSelector: '.box' 
});

我想要使用Ajax調用一些其他替換框：頁面加載後，用磚石初始化

<div class="container"> 
<div class="box"></div> 
<div class="box"></div> 
<div class="box"></div> 
</div>

後。 AJAX IM之前使用：

$('.container').masonry('remove', $('.container .box'));

，它加載後：

$('.container').prepend(data).masonry('appended', data);

它加載所有新的箱子和砌築汽車positione它，但它也使在容器的頂部有很大差距。新框不會添加到容器的頂部，而是完全位於刪除框結束的相同位置。我試圖用像reloadItems，佈局等，但沒有一些磚石功能有助於:( 有人知道解決我的問題

來源

2014-06-25 abiku

你混合兩種相反的方法？ - 前插和追加看來，砌體需要確切地知道哪一方您將您的內容看一看的文檔，例如：

http://masonry.desandro.com/methods.html#prepended

在第一次打擊讓剛剛嘗試更改您的代碼：

$('.container').prepend(data).masonry('prepended', data);

來源

2014-06-25 13:25:54

感謝您的幫助。我已經改變了你的代碼，現在我有了差距，但在所有框的底部。看起來砌體認爲仍然有一些箱子，並且正在計算容器的高度，就好像它們仍然存在一樣，即使它們沒有被顯示。我試圖手動設置競爭者的高度，但它並沒有幫助 – abiku

你是否在某處在線？我無法解決問題而無法觸及它。 –

我剛碰到這個問題，我的解決方案是：

1刪除原來的項目。

2刪除元素上的砌體功能。

3重新初始化元素上的砌體功能。

4然後使用前置添加新項目。

//These were defined globally. 
var masonryOptions = { 
    columnWidth: 450, 
    itemSelector: '.feature-block', 
    gutter: 20 
}; 

$grid = $('.masonry-grid').masonry(masonryOptions); 

function clear() { 
    $grid.masonry('remove', $grid.find('.feature-block')); 
    $grid.masonry('destroy'); 
    $grid = $('.masonry-grid').masonry(masonryOptions); 
}

來源

2017-01-20 16:19:08

JQuery Masonry不刷新容器高度

回答

相關問題