Question

问题是从7个月前在github上问过这个问题的另一个用户复制的，因为我遇到了同样的问题而且没有找到解决方案GitHub Question Link.

我在wordpress项目中使用Magnific-Popup与同位素一起制作了带幻灯片和过滤器的图库。当我使用同位素过滤项目时，它会添加类isotope-hidden。但是，在幻灯片模式下，magnific-popup会忽略该类并显示所有项目。

我的弹出项目位于带有.portfolio-item类的div中我正在使用以下代码进行夸张弹出

 $('.image-link').magnificPopup({
            type: 'image',
            image: {
                titleSrc: 'alt',
                verticalFit: true
            },
            gallery:{
                enabled:true
            }              
        });

Answer 1

尝试在magnificPopup初始化中定位同位素元素的容器，如下所示：

$('.container').magnificPopup({
    delegate: ':not(.isotope-hidden) a.item',
    type: 'image',
    image: {
        titleSrc: 'alt',
        verticalFit: true
    },
    gallery:{
        enabled:true
    }              
});

如果您使用内置的现成解决方案，例如这一个：http://codecanyon.net/item/media-boxes-responsive-jquery-grid/5683020它使用了isotopeV2和Magnific Popup已经

Answer 2

我也有同样的问题。阅读这里和GitHub上的一些建议让我尝试这个：

delegate: 'li:not(.isotope-hidden).item a'

在我的背景下，它有效。目前的工作实验是here。

从幻灯片中排除同位素隐藏的项目

2 个答案: