Question

我一直在玩砌砖，同位素和包装几个小时，而且在我的生活中不能按预期工作。

我的目标是创建帖子网格，帖子可以是父容器的两个宽度，25％或50％。邮件的宽度是随机生成的服务器端。然而，有些情况下，第一行包含一个大的间隙，一个帖子可以适合为了更好地说明这一点，我把小提琴放在一起

HTML

<div id="container" class="packery" style="width: 100%">
<div class="grid-sizer"></div>
<div class="item w" style="background-color:#aaa;"></div>
<div class="item w2" style="background-color:#ff0000; width:25%;"></div>
<div class="item w" style="background-color:#00ff00; width:50%;"></div>
<div class="item w" style="background-color:#affaff; width:50%;"></div>

JS

docReady( function() {
var $container = jQuery('#container');
$container.packery({
  itemSelector: '.item',
  scolumnWidth : ".grid_sizer"
});

}）;

是我正在尝试的完整小提琴 http://jsfiddle.net/nLqu015m/

在上面的例子中，我希望packery重新排列元素，以便红色元素是最后一个项目，在最后一行之前的行中没有难看的间隙。

我也尝试在同位素中实现同样的目标但面临同样的问题。

我错过了一些明显的东西，还是我误解了Packary和Isotope的目的？

任何帮助都将不胜感激。

Answer 1

由于你没有加载同位素，这在你的小提琴中不起作用。

包装/同位素网格未按预期重新排列

1 个答案: