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

Question

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

Answer 1

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

它有选项closeBtnInside，应该将关闭按钮放在内容中。在我的情况下，此选项不起作用（显示图像时）。然后我尝试通过设置类mfp-close的顶部和右侧来定位关闭按钮来更改CSS。它似乎首先工作，但当点击按钮它移回旧位置。没有找到可能也需要更改的其他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);

也适用于箭头按钮。