Jquery 砌体尺寸调整问题

我们正在一个网站上工作，这是响应向下移动。然而，砖石结构有点浮躁，因为当调整窗口大小时，它会移动以允许另一列，但这些列不会填充它

有人知道解决这个问题的好办法吗

---

谢谢

我不确定这是否能帮到你。这就是我在我的网站上使用的东西，调整大小应该是这样的。也许如果您修改代码，它也会适合您

代码中似乎缺少以下函数。#容器是包装所有项目的容器。在你的情况下，这是工作循环。.span1BoxWrapper是项的主包装器。问题似乎出在您的mainworks循环包装器及其宽度上。我在firebug中取出了宽度，这些物品正确地重新定位。下面缺少的函数应该可以修复这个问题

注意：如果我将.js文件更改为jquery.massy.js（就像您所做的那样），布局将不再工作，因此这可能也是您的问题的原因。另一个原因可能是框在调整屏幕大小时收缩

<!--boxes arrangement-->
<script src="js/jquery-1.8.2.min.js"></script>
<script src="js/jquery.masonry.min.js"></script>
<script src="js/modernizr-transitions.js"></script>
<script>

  $(function(){

    $('#container').masonry({
      itemSelector: '.span1BoxWrapper',
      //cornerStampSelector: '.corner-stamp',
      columnWidth: 1,
      isAnimated: !Modernizr.csstransitions,
      //isRTL: true,
      isFitWidth: true
    });

  });
</script>
<style>
#container{
    background:#fff;
    padding:10px 10px 0 0;
    border:1px dotted #ccc;
    margin:0 auto 20px;
    overflow:hidden;
    clear: both;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
}
</style>

$（函数（）{
$（“#容器”）。砌体({
itemSelector:“.span1BoxWrapper”，
//cornerStampSelector:“.CornerStamps”，
列宽：1，
我说：！现代化，
//是的，
isFitWidth:正确
});
});
#容器{
背景：#fff；
填充：10px 10px 0；
边框：1px点#ccc；
保证金：0自动20px；
溢出：隐藏；
明确：两者皆有；
-webkit边界半径：5px；
-moz边界半径：5px；
边界半径：5px；
}