jquery - 自定义放置在放大弹出框中的箭头

我想将箭头放在柜台旁边，大致像这样：



其中“ ”是“ figcaption .mfp-bottom-bar”中照片下方的箭头按钮。
由于默认箭头位于.mfp容器中，因此我不能仅将它们绝对定位，因为图片可以具有任意高度和宽度，并且我需要使其像素完美。

我有一个非功能性的解决方案：
在$（''）。magnificPopup调用的图库对象中

{
tCounter:
"<button title='previous' type='button' class='mfp-arrow mfp-arrow-left mfp-prevent-close'>&lt;</button>"
+
" %curr%/%total% "
+
"<button title='next' type='button' class='mfp-arrow mfp-arrow-right mfp-prevent-close'>&gt;</button>"
}

不幸的是，即使原始箭头仍然有效，它也不会触发任何操作。

所以我想知道：


如何在HTML的figcaption中放置默认箭头？
如何使tCounter中的按钮触发上一张和下一张图片功能

最佳答案

看起来我没有足够仔细地阅读api

var magnificPopup = $.magnificPopup.instance;

$('body').on('click', '#photo-prev', function() {
    magnificPopup.prev();
});

其中＃photo-prev是上一个按钮的ID

关于jquery - 自定义放置在放大弹出框中的箭头，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/20940348/