jQuery Isotope 切换内容

jQuery Isotope toggle content

本文关键字：Isotope jQuery      更新时间：2023-09-26

我有大量的文章标题，每个标题都根据来源有一个类名。当网站加载时，将显示所有标题。来源列在页面顶部，我希望Isotope在单击时显示或隐藏每个来源，以便用户可以选择他们喜欢的来源。

就目前而言，我可以将它们删除，但我不确定如何让它们再次出现。

jQuery(function($){
    var $container = $('.isotope-box');
    $container.isotope({
    masonry: {
        columnWidth: 333,
        cornerStampSelector: '.corner-stamp'
    },
    itemSelector: '#headlines'
});
// filter items when filter link is clicked
$('#filters a').click(function(){
    $(this).toggleClass("active");
    var selector = $(this).attr('data-filter');
    var $removable = $container.find( selector );
    $container.isotope( 'remove', $removable );
    jQEvent.preventDefault();
});
$('#filters a.active').click(function(){
    $(this).toggleClass("active");
    var selector = $(this).attr('data-filter');
    var $addition = $container.find( selector );
    $container.isotope( 'insert', $addition );
    jQEvent.preventDefault();
    });
});

我猜问题出在我的"插入"代码上，但我不确定它应该如何工作。我也在使用无限滚动，我需要使用相同的过滤器显示新添加的页面。

请帮忙！

马丁

你可以过滤掉不需要的同位素元素，不是吗？过滤类将是你的来源（nyt，wsj，wp，...）。如果你.remove（）它们，你就把它们从DOM中删除了！请参阅过滤文档，但也许我不太明白您的问题？

相关文章：