Question

我正在使用Magnific Popup插件。我的代码如下 -

        $(".event").magnificPopup({

            items: {

                src: ".hidden-div",
                type: "inline"
            },
            closeBtnInside: true
        });

事情是我试图弹出的“.hidden-div”部分，它的CSS显示属性设置为none，因为我希望它只能通过弹出窗口在页面上显示。

那么有没有办法在执行上面的脚本时将其显示属性设置为'block'，并在弹出窗口关闭时将其设置为'none'？

Answer 1

根据设计，您应该将mfp-hide CSS类添加到应隐藏的元素中。 Magnific Popup会在打开/关闭时自动切换它。 http://dimsemenov.com/plugins/magnific-popup/documentation.html#inline_type

Answer 2

这就是它现在的工作方式。基本上我提到了API here

$(".event").magnificPopup({

            callbacks: {
                open: function(){

                    $(".hidden-div").css("display", "block");
                },
                close: function(){

                    $(".hidden-div").css("display", "none");
                }
            },

            items: {

                src: ".hidden-div",
                type: "inline"
            },
            closeBtnInside: true
        });

我希望它对其他人也有用！稍微偏离主题，非常喜欢插件！

如何在Magnific Popup中更改CSS属性

2 个答案: