砌體圖像加載問題

我在我的一個頁面上發現了一些問題，它們從服務器上抓取大量圖像，將它們傾倒在屏幕上，並使用砌體將它們全部排除。砌體圖像加載問題

所有的圖像加載，但它似乎像磚石被稱爲方式之前的圖像加載爲底部，所有的圖像加載一團糟。我附上了一些截圖來向你展示。請注意，這也發生在其他頁面上。

enter image description here

而且一些我使用的重要的代碼。

<script> 
$.each($('.img-grid-container img'), function (index, obj) { 
    $(this).css({ 
     'width' : (50 + Math.round((Math.random()) * 330)) 
    }); 
}); 
</script> 

<script> 
var $container = $('.img-grid-container'); 

$container.imagesLoaded(function(){ 
    $('#grid-section').fadeIn("normal"); 
    $('#loader-container').hide(); 
    $container.masonry({ 
    itemSelector : '.attachment-full', 
    columnWidth: 30 
    }); 
}); 
</script>

任何幫助總是讚賞。

-R

來源

2012-02-08 John the Painter

[我認爲它看起來，因爲它很酷，只是讓他們拖拽元素和你做......]總之：

你的磚石代碼看起來好像沒什麼[我有事幾乎相同爲我工作]但：

是否所有的JQuery在文檔中準備好了？
如果您先調用masonry然後淡入＃grid-section會發生什麼？
我不知道你的容器選擇器是否是問題。如果你的頁面上有這個類的多個實例，那麼我不知道在加載第一個或最後一個實例之後imageLoaded是否會觸發。

[如果它可以幫助你可以使用.masonry（「刷新」），以您的磚在任何時間排序]

希望有所幫助。

來源

2012-02-08 16:29:57 iiz

感謝您的幫助。我沒有將石工包裝在一個文檔中，所以會先嚐試（我認爲這些圖像應該已經修復了）。 – 2012-02-08 18:45:16

砌體圖像加載問題

回答

相關問題