Bootstrap 选项卡 + Jquery Masonry答案

【问题标题】：Bootstrap tabs + Jquery MasonryBootstrap 选项卡 + Jquery Masonry
【发布时间】：2013-01-27 17:06:52
【问题描述】：

我最近一直在用头撞很多墙，但找不到任何有效的答案（即使是 this solution 我可能不明白）。

我在 div(class="box") 上使用砖石结构，我正在尝试将这些 div 放入引导选项卡中。

问题是：重新加载效果不佳，留下间隙并表现得像最后一个 div 没有被清除。

我试过了：

$('a[data-toggle="tab"]').on('shown', function (e) {
            $('#content').masonry( 'reload' );
        });

但这当然行不通。请帮忙

【问题讨论】：

标签： jquery twitter-bootstrap tabs jquery-masonry

【解决方案1】：

$('a[data-toggle=tab]').on('shown.bs.tab', function (e) {
    $(window).trigger("resize");
});
$(window).resize(function(){
    $this = $('#content');
    $coloumn = $this.width() / 4;
    $this.masonry({ columnWidth: $coloumn, gutter: 0, itemSelector: '.content_block_row_wrap' });               
});

我用类似的代码修复了类似的问题。现场演示：http://shop.theme.firmasite.com/premium-features/ 检查它的代码。

【讨论】：