Question

我创建了一个同位素页面，上面有许多不同的高度元素。大多数元素的宽度相同，但我希望能够使用跨越前两列的“大”框来启动流程。

如果isoTope以较小的宽度块之一开始，则在正常布局中放置较大的块是可以的。但是，如果我放入更大的一个，它会突然将所有内容放入一列，尽管我在jQuery语句中添加了任何设置（例如将列宽指定为300宽）。

是否有人可以查看我所做的事情并建议这是一个真正的错误还是我缺少的东西？我试图将大块放在底部，然后使用排序功能将其置于顶部，但同样的问题也会发生。

任何帮助都会非常感激，因为我不确定我做错了什么！

干杯，

丹

Answer 1

不知怎的，这可能有用......

Masonry是Isotope的默认布局模式。项目元素是   在垂直网格内智能排列。对于每个项目元素，   该脚本计算网格中项目的下一个最佳拟合。

网格中一列的宽度。 如果没有设置值   columnWidth，默认为第一个项元素的宽度。

解决方案将是

$('#container').isotope({
  masonry: {
    columnWidth: 1 // or any number smaller than your medium size box/item
  }
});

通过将columnWidth设置为'1'，它会强制同位素使用定义的columnWidth而不是第一个元素的大小。因此，从早先的回复中证明我的回答（删除:(）

Answer 2

您现在可以将列宽设置为选择器，可能只是用于查找布局中未包含的事物大小的项目。阴沟也是如此。

见这里：