我正在尝试将 jQuery Isotope 与我的 Twitter Bootstrap 网格一起实现,但我被卡住了。

我有一个通常的列的引导标记。我有三行(.row-fluid),每行里面有三列(.span4)

现在,当我在上述列上调用 Isotope 时,我得到的是一行中的第三个元素进入新行,即使顶行中有空间。你能帮忙吗。

我的 jQuery 是这样的(忽略 jsfiddle 上的其他变量):

pGrid.isotope({
    hiddenStyle  : { opacity : 0 },
    visibleStyle : { opacity : 1 },
    itemSelector : '.span4',
    layoutMode   : 'fitRows',
    resizable: false
});

我已经设置了在 jsfiddle 上发生这种情况的示例:http://jsfiddle.net/HASg6/

最佳答案

我无法确定您的代码到底出了什么问题,但是您确实需要摆弄 CSS 才能让 Bootstrap 和 Isotope 一起很好地发挥作用。您可能还想尝试将所有同位素细胞放入一个容器中,而不是将行放入一个容器中。

这是 Bootstrap 和 Isotope 的一个演示: http://www.bootply.com/60295 这个演示还使用媒体查询来确保根据屏幕大小响应地调整图像大小。

关于Jquery Isotope 和 Twitter Bootstrap 网格,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/15627338/

10-13 00:35