我将jQuery Masonry样式(http://masonry.desandro.com/)与jQuery Quicksearch(https://github.com/DeuxHuitHuit/quicksearch)一起显示结果。
当我进行搜索时,不匹配的“砖块”被删除/隐藏 - 这是正确的。但剩下的,匹配的“砖头”遍布整个页面,因为它们被锁定在一个特定的位置。
我知道当您调整浏览器窗口宽度时,Masonry能够重新定位“砖块”,所以我的第一个想法是只需做+1px
和-1px
来实现通过向Quicksearch onAfter
- 选项添加内容来触发此效果: - 像这样:
onAfter: function (){
window.resizeBy(101,0);
}
只是为了检查我是否可以设法更改窗口大小,但这根本不起作用。
有人做过类似的事情吗?
- 或者,有没有办法在事件发生后重新定位砌体 - “砖块”,如keyUp
或其他什么?
答案 0 :(得分:0)
尝试使用以下内容,除了一件事(下面的内容)之外,它对我有用:
jQuery('input#inputfinderid').quicksearch('#content-block .item-to-search',
{
'delay': 200,
'show': function () {
//show parent of the items found
jQuery(this).parent().show();
},
'hide': function () {
//hide parent of the items not found
jQuery(this).parent().hide();
},
'onAfter': function () {
if (jQuery('input#inputfinderid').val()) {
//hide parent as you type
jQuery(this).parent().parent().hide();
} else {
//show parent as you type
jQuery(this).parent().parent().show();
}
//re-sort masonry objects
jQuery('.js-masonry').masonry('layout');
}
});
我遇到的唯一麻烦是有时布局不能正确调整,如果我有3列,它将创建3行,每行有1列/项。但有时它会正确显示1行中的所有3个项目。
有人可以帮忙吗?