砌体 - 单击后展开，但保留列

Question

我试图构建一个基于Masonry的双列布局，点击后展开框。

我目前的代码在这里：http://jsfiddle.net/2auahsuz/

扩展块的JavaScript：

expandBlocks: function() {
    $('.main-blocks').on('click', 'article.expand, article.collapse', function() {
        Functions.expandThis($(this));
    })
},


expandThis: function(block) {
    var scrollTo = block,
            mode;

    $('.main-blocks').off('click');

    $('article').not(block).each(function() {
        $(this).removeClass('collapse').addClass('expand').children('.desc').velocity('slideUp', {duration:100});
    });

    if(block.hasClass('expand')) {
        mode = 'slideDown';
        block.removeClass('expand').addClass('collapse');
    } else {
        mode = 'slideUp';
        block.addClass('expand').removeClass('collapse');
    };

    block.children('.desc').not(':animated').velocity(
        mode, {
            duration: 200,
            progress: function() {
                $('.main-blocks').masonry();
            },
            complete: function() {
                Functions.masonryBlocks(scrollTo);
                Functions.expandBlocks();
            }
        }
    );
}

一切都很好，但我想要的是保持列顺序。我的意思是，当我点击左侧的一个区块时，我想仅在该区域下方的区块中设置动画，而不是右侧的区域。我可以实现吗？