0

我一直在使用jQuery Equal Column Heights来匹配我网站上的主要内容和侧边栏，没有任何问题。更重要的是，我有一个成员目录，其中每个人都有一个“更多信息”按钮，该按钮使用 toggle() 来展开 div 并显示更多信息。单击它时，我还让它触发 equalHeightColumns() 函数来调整扩展 div 的列。同样，这有效。

我已经添加了同位素来过滤这个成员目录。它可以工作，但是当我点击“更多信息”按钮时，不再调用 equalHeightColumns() 函数。没有错误出现。

我的切换（），equalHeightColumns（）代码：

    $(document).delegate('.toggle', 'click', function(){

    // get the sibling node with class 'hidden-info'
    var mysection = $(this).prev('.hidden-info');
    mysection.toggle('fast');
        $(this).html($(this).html() == '<td>LESS INFO</td>' ? '<td>MORE INFO</td>' : '<td>LESS INFO</td>');

    var fullbio = $(this).parent().parent().prev('.hidden-bio');
    fullbio.toggle();

    var partialbio = $(this).parent().parent().prev().prev('.hidden-bio');
    partialbio.toggle();

    if ( $(window).innerWidth() > 800) {
    $('#content, #sidebar, #content-sidebar-wrap').css('height' , 'auto');
    $("#content, #sidebar, #content-sidebar-wrap").equalHeightColumns();
    }

   else {
    $('#content, #sidebar, #content-sidebar-wrap').css('height' , 'auto');
   }

});

我的同位素代码：

$(window).load(function(){
var $container = $('.professionContainer');
$container.isotope({
    transformsEnabled: false,
    filter: '*',
    animationOptions: {
        duration: 750,
        easing: 'linear',
        queue: false
    }
});

$('.professionFilter a').click(function(){
    $('.professionFilter .current').removeClass('current');
    $(this).addClass('current');

    var selector = $(this).attr('data-filter');
    $container.isotope({
        filter: selector,
        animationOptions: {
            duration: 750,
            easing: 'linear',
            queue: false
        }
     });
     return false;
});
});

如果您需要任何其他信息，请告诉我。

谢谢。

编辑：我意识到如果我再次单击链接，则会触发 equalHeightColumns 函数。

4

1 回答 1

0

我想通了：我需要在切换条目后扩展 Isotope 容器，然后再调整列。所以在函数中，我添加了

$container.isotope('reLayout');

打电话之前.equalHeightColumns();

于 2013-07-09T22:32:34.307 回答