我在每个类别中都有多个项目，但我只想在加载时显示每个类别中的前3个项目，然后在过滤时，它应显示该类别中的所有项目。我发现number of posts在选项中使用“过滤器”只加载一个类别，但这不是我想要做的。我嘲笑a codepen。现在，每个类别中有4个元素，但我想在加载时只显示3个元素。
以下是我尝试过的一些事情。 1.我在CSS中的所有项目中添加了display：none，然后使用lt（）从每个类中选择前3个项目以在加载时显示它们。
$('.webinar.item:lt(3), .video.item:lt(3), .printable.item:lt(3)').show();
这在加载时效果很好，但在过滤后，所有项目一旦隐藏就会消失。 Isotope不会添加显示：阻止过滤的项目，因此CSS在页面加载后覆盖并隐藏这些项目。我更改了Isotope文件以添加display：block;过滤器，但这真的搞砸了动画，并在过滤类别时引起了大量的跳跃。
2）与上面相同，但我在CSS中将不透明度设置为0，使用以下内容将每个类别的前3个项目设置为可见但是，正如预期的那样，只有“空”块，其中addt' l项目将是因为它们仍被Isotope定位。
$('.webinar.item:lt(3), .video.item:lt(3), .printable.item:lt(3)').css('opacity', '1');
如上所述，我只想在加载时显示每个类别的前3个项目。我感谢任何帮助。
答案 0 :(得分：1)
好吧，显然我只需要输入这个就可以得出我自己问题的答案。 :)对于那些已经找到这个主题并希望做类似事情的人，这就是我所做的。
我使用jQuery来隐藏所有项目而不是CSS，所以它只会发生一次。
我隐藏了列表中的所有项目
$('.isotope-list .item').hide();
然后，使用lt（）显示每个类别的前3个。这使我只能在加载时显示3并且没有以任何方式搞乱过滤。
$('.webinar.item:lt(3), .video.item:lt(3), .printable.item:lt(3)').show();