javascript - 应用数据过滤器

Answer 1

您可以为此使用同位素，如果您想要一个仅 jQuery 的解决方案，请告诉我。

此外，您的第二种方法很好'隐藏所有 div 准备就绪。拉数据过滤器的 div 属性，然后取消隐藏具有数据过滤器字段类的 div。

不要忘记将其添加到您的脚本中，这应该基本上可以解决您的问题。

$('#portfolio-filter a').click(function(e){
       e.preventDefault();
        $('#portfolio-filter .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;
    }); 
});

Answer 2

我很快就写了这个，也许它会对你有所帮助。

这个想法是你使用:not CSS选择器

.showcat1 > .item:not(.cat1) {
    display: none;
}

然后只需在包装器上切换类