Jquery Isotope和Twitter Bootstrap网格

时间:2013-03-26 00:33:36

标签: jquery twitter-bootstrap jquery-isotope

我正在尝试将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/

1 个答案:

答案 0 :(得分:0)

我无法确定你的代码究竟出了什么问题,但你确实需要使用CSS来让Bootstrap和Isotope很好地协同工作。您也可以尝试将所有同位素单元格放入单个容器中,而不是行。

以下是Bootstrap和Isotope的演示:http://www.bootply.com/60295此演示文稿还使用媒体查询来确保根据屏幕大小调整图像大小。