jquery同位素调整大小以处理扩展的手风琴

Question

我正在使用jquery同位素作为联邦监管活动的可排序文本列表。我们在一个文档中列出每个更新，每个文件列表可能会变得很长。我已经将Bootstrap简易手风琴面板添加到具有两个以上更新的项目中，以使每个项目面板的高度相当一致。当我打开手风琴面板时，同位素窗格不会调整大小以适应扩展的手风琴。

关于如何让同位素面板调整高度来处理扩展手风琴的任何想法？

谢谢！

Answer 1

要修复它，您需要在所有项目的大小合适后进行初始化或布局。 只需添加以下代码：

$('.panel').on('shown.bs.collapse', function (e) {
    $grid.isotope('layout');
})

Answer 2

简单列表布局中有一个同位素选项。

javascirpt：

$('.container').isotope({layoutMode: 'straightDown'})

在为css添加修复程序后，从插件执行中覆盖动态内联样式：

.isotope .isotope-item {
    min-height: 0px !important;
    position: static !important;
    transform: translate3d(0px, 0px, 0px) !important;
}
.isotope-hidden{
    display: none;
}

我希望这对你有所帮助。

Answer 3

您必须在回调中为同位素“reLayout”添加一个函数。

function() {$('#container').isotope('reLayout');}

放置它的地方的一个例子：

$(this).next().slideDown(
    function() {$container.isotope('reLayout');}
);