magnific-popup - 如何自定义箭头和关闭按钮？

Question

我想自定义和定位（替换为自定义图像 jpg/png）箭头和关闭按钮。任何帮助，将不胜感激。

Answer 1

也许有点晚了，但我发现了一些东西：在定位按钮的情况下，magnific-popup 显然不是直截了当的。

它具有closeBtnInside应将关闭按钮放置在内容内的选项。就我而言，此选项不起作用（显示图像时）。然后，我尝试通过设置类的顶部和右侧来更改 CSSmfp-close以定位关闭按钮。起初它似乎可以工作，但是当单击按钮时，它又回到了原来的位置。没有找到其他可能需要更改的 CSS 类。

我最终自己设置了关闭按钮的 HTML（包括设置自己的图像）并使用内联样式定位关闭按钮：

var magnificPopupOptions =
{
   delegate: 'a',
   type: 'image',
   closeMarkup: '<button title="%title%" class="mfp-close" style="position: absolute; top: 30px; right: -15px"><img src="/Content/images/close-icon.png" width="25" height="29"/></button>',
};
$('<Selector>').magnificPopup(magnificPopupOptions);

也应该适用于箭头按钮。