jQuery，砌体堆砌？

Question

我一点帮助，我的网站后： http://www.lovejungle.com/dev/testenvironment/?cat=5

我的印象是，jQuery的砌体堆叠的对象紧密 - 由于某种原因，当我随机他们之间的格框的，我得到很大的开放空间？

任何人都可以看到为什么会发生这种情况吗？

基本上我希望创建一个类似的网站，这一个：http://www.jwt.com/

让我知道如果你需要任何代码或了解更多信息，我会及时回复！

干杯！

迈克尔

Answer 1

从jQuery Masonry网站报价：

把它看作CSS 花车的另一面。而浮动水平然后垂直排列 元素， 砌体垂直排列元素 然后水平根据网格。

所以，基本上，你的内容将很好地适应只有当所有的元素宽度保持不变。就像float如何很好地吻合，如果所有元素的高度相同。您可以在您提到的网站上观察到这种效果：http://www.jwt.com/其中所有堆叠的元素具有相同的宽度。 :)

HTH。

---

编辑：这也意味着你的元素可以是在网格中的其他元素的倍数宽度。你可以有一个大的元素，它是普通元素宽度的3倍。

Answer 2

我必须说，我不完全熟悉砖石内部是如何工作的，但有一些我已经在网站上发现两件事情可能与此问题的帮助：

1. 我注意到，您的列编号为col2 - col4。在你的javascript中，你指定你的columnWidth属性为200px，这意味着每一列的宽度都是200的倍数。我不确定源是否假设col1是200，col2是400等。 。所以，也许尝试编号你的列从col1开始，而不是col2。

2. 我注意到，你的列不是完全200像素的宽度或一个确切的倍数。你需要margin + padding + width为200。从你的CSS似乎这是不是可以从下面的例子可以看出的情况：

col2的：

宽度= 170像素 填充上盒= 10px的 你在JS添加保证金= 10px的

这给你

170 + 10 + 10 + 10 + 10 = 210px

同样是真实的其他专栏也是。

我并不是说修复上述两个问题可以解决您遇到的问题，但值得一试。