將不同尺寸的圖像很好地拼接到拼貼中

Question

我正在尋找一個JavaScript庫（或者我可以實現的算法），以便在單個頁面上適合任意大小的圖像，並且只剩下很少的空白。類似於Google Plus顯示圖片 [example]的方式。或者，甚至可能更有趣（谷歌使他們相同的高度）

只要縱橫比沒有混亂，並且看起來「合適」的東西很好在頁面上。

Answer 1

您可以使用流行的庫Masonary。

jQuery的動態佈局插件CSS的翻蓋側漂浮

下面是一個代碼example ...

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

這裏是Github源和與採訪Shoptalk播客上的David Desandro。

提示：確保父容器具有position：relative，以便所有內容都綁定到您的容器。