宏伟的弹出窗口是引导模式的背后

Question

我正在使用Magnific Popup，我的图像位于Bootstrap模式中，当我单击图像时，Magnific Popup位于Bootstrap模式后，如下所示：

如何在单击图像后将“ Magnific Popup”放置在Bootstrap模版后面或能够关闭Bootstrap模版？ （我认为这不是最好的解决方案）

$('.zoom-gallery').magnificPopup({
    delegate: 'a',
    type: 'image',
    closeOnContentClick: false,
    closeBtnInside: false,
    autoFocusLast: true,
    mainClass: 'mfp-with-zoom mfp-img-mobile',
    image: {
        verticalFit: true,
        titleSrc: function (item) {
            return item.el.attr('title') + ' &middot; <a class="image-source-link" href="' + item.el.attr('data-source') + '" target="_blank">image source</a>';
        }
    },
    gallery: {
        enabled: true
    },
    zoom: {
        enabled: true,
        duration: 300, // don't foget to change the duration also in CSS
        opener: function (element) {
            return element.find('img');
        }
    }
});