Fancybox - 将上一个/下一个箭头保持在同一个位置答案

【问题标题】：Fancybox - keep prev/next arrows in same placeFancybox - 将上一个/下一个箭头保持在同一个位置
【发布时间】：2013-09-23 16:46:20
【问题描述】：

我正在使用 Fancybox 作为图片库。

图像具有不同的宽度，因此箭头会根据图像宽度移动（向内或向外）。

我的客户希望箭头留在一个位置，这样您就可以轻松地点击一组，而无需来回移动来点击。我在这里查看了所有 Fancybox 问题，但没有找到答案。我已经尝试更改 CSS，但无法使其正常工作。

画廊是here。

【问题讨论】：

如果使用fancybix v2.x，为什么不使用按钮助手？检查fancyapps.com/fancybox/demo并查看源代码

标签： jquery navigation fancybox arrows

【解决方案1】：

例如，您可以将导航链接的 CSS 位置更改为固定 - http://jsfiddle.net/yJFxS/

.fancybox-nav {
    position: fixed;
    top: 0;
}
.fancybox-nav span {
    visibility: visible;
}

.fancybox-next span {
    right: 40px;
}

.fancybox-prev span {
    left: 40px;
}

【讨论】：

【解决方案2】：

我建议您使用插件选项“showNavArrows”禁用标准的上一个/下一个按钮。然后您可以制作自己的上一个/下一个按钮，并将它们固定或绝对放置在 fancybox-overlay 中（例如右上角）。如果你看一下fancybox api，你会发现你可以触发pref/next：

$.fancybox.next
$.fancybox.prev

http://fancybox.net/api

【讨论】：

仅作记录：fancybox.net/api 指的是旧版本的fancybox，与OP使用的版本不兼容。
我确定所有版本都有上一个/下一个 api :-)
感谢您的帮助。我认为这超出了我的能力 - 我不知道 javascript。我会使用按钮助手，除非客户不喜欢它的外观。我认为可能有一种简单的方法可以做到这一点，或者我可以复制/粘贴。但感谢您的想法。