垂直浮動網格圖像庫

我知道你可以用某種方式實現這種效果，但有沒有辦法讓網格圖像垂直浮動 - http://www.effektivedesign.co.uk/？垂直浮動網格圖像庫

好吧，所以我嘗試了masonry.js，它在初始階段很好地工作，但是使用與磚石的媒體查詢並不完美。如果一個對象被調整大小，效果會持續下去，這樣我就可以保留它。我想要磚石的效果，但要用CSS。這隻能用表格完成嗎？

2012-03-22 Nerdysyntax

您可以製作4個div列，其中包含float: left。使用劃分算法，該劃分算法將4組圖像中的一堆圖像用大致相等的加總高度進行劃分。將組1的圖像放在左邊的div中，組2的圖像放在第二個div中等。

2012-03-22 00:51:03

這聽起來像是一個艱難的交易。我的數學不那麼強。謝謝您的幫助。在這種情況下，我會堅持試圖找出表格版本。 – Nerdysyntax 2012-03-22 02:36:45

如果確定圖像排列，算法非常簡單： 1.將所有圖像高度相加併除以列數。這是每列的高度。 2.啓動forloop並對圖像高度進行求和。將圖像放在第一列。 3.如果總計高度高於色譜柱高度，重置計數器並開始在第二列中添加圖像。 4.如果所有圖像都放在列中，每列應該具有大致相等的圖像高度。如果安排沒有確定，揹包算法可能會完成這項工作。 – 2012-03-22 09:29:15

垂直浮動網格圖像庫

回答

相關問題