jQuery Masonry——在窗口调整大小事件中限制为最大宽度？答案

【问题标题】：jQuery Masonry—Constrain to a Maximum Width on Window Resize Event?jQuery Masonry——在窗口调整大小事件中限制为最大宽度？
【发布时间】：2012-05-11 03:49:34
【问题描述】：

我正在使用jQuery Masonry 来显示一个方框网格（大小都一样）。

Here is my testing site.

当浏览器宽度为 1100 像素或以下时效果很好。

在 1270px 及以上查看时，Masonry 会不断在右侧添加列。

我在外部容器上设置了最大宽度，但 Masonry 似乎不承认它，只是不断扩大 Masonry 容器的宽度。

在Masonry Centered page上，可以看到居中，但是没有限制宽度。随着浏览器宽度的增加，它只会不断扩展并添加更多列。

如何添加一个硬性规则来说明“这是最大宽度。停止尝试添加更多列。”

谢谢

更新 Here is a jsfiddle，虽然我不确定它是否设置正确。最好只是去my testing site 看看问题。

【问题讨论】：

您是否尝试过使用containerStyle 选项来砌体？
我包含了containerStyle 选项，但由于某种原因它似乎没有读取它。现在应该将position: absolute 放在项目包装器上，但事实并非如此。
这里是小提琴。不是有史以来最好的小提琴，但它确实有效。如果你可以让它不超过 3 列，你会得到一个 cookie。不要担心奇怪的悬停状态。 jsfiddle.net/26dsg/4/embedded/result
!important 似乎破坏了您的布局。尝试不使用它。
删除!important后似乎仍然出现resize问题

标签： javascript jquery max jquery-masonry css

【解决方案1】：

在砌体容器的父元素上设置max-width 对我有用。这不是您想要的结果吗？

#wrapper { max-width: 990px; }

【讨论】：