代码之家 › 专栏 › 技术社区 › mayersdesign

过滤网格后重新应用jquery匹配高度

jquery-isotope jquery

mayersdesign · 技术社区 · 6 年前

jquery-match-height 以匹配同位素布局的网格项内的内部div的高度,当同位素网格加载时,这是完美的工作方式。

过滤网格 ,则div不再由matchheight脚本处理,每个div都返回其原始高度。

我试过:

  $grid.on( 'arrangeComplete', function() { 
   console.log("OK, arrangeComplete");
   $.fn.matchHeight._update();
   //$('.card-text').matchHeight(); //Here I tried simply re-initiating... no effect
  });

if (!$grid.data('isotope').filteredItems.length ) {
 $.fn.matchHeight._update();
}

2 回复 | 直到 6 年前

Mohammadreza Esmaeeli 6 年前

这不是一个完美的方法,但你可以尝试:

setInterval(function(){
  $(function() {
    $('.item').matchHeight(options);
  });
} , 300);

mayersdesign 4 年前

好吧,我一点也不确定这是最优雅的方法,但它已经奏效了。

可见元素 (由于筛选器不会删除与筛选器不匹配的项,因此它只是将它们设置为“display:none"

//Filter complete
$grid.on( 'arrangeComplete', function( event, filteredItems ) {
  //matchheight on the visible items 
  $('.item:visible').matchHeight(); 
  //And re-layout the grid  
  $grid.isotope('layout'); 
});

推荐文章

Newbie_Coder · 如何使用Jquery无画布裁剪框架

1 年前

usman610 · Javascript代码在点击回车键和点击按钮时删除行

1 年前

NovoMannen · 导航中的下拉菜单在内容后面重叠

1 年前

Carly · 在页面加载时滑入div,然后单击以滑入和滑出(jQuery)

1 年前

Community wiki · jquery弹出窗口不会用按键关闭,但会点击

1 年前

Community wiki · Smarty IE9请求下载index.php文件(在上传未发生后)?是我的代码出错还是activecollab?

1 年前

Community wiki · 无法从jquery文档调用函数

1 年前

marzouk najib · Uncaught ReferenceError:未定义FullCalendar

2 年前

Pepe · 检查“data”属性是否包含输入值的一部分(jQuery)

2 年前

laurence keith albano · 如何使用Jquery在父类内添加子父类

2 年前