Question

我有一个很好的FancyBox2实现，可以将iFrame中的html页面作为图库加载。

但是，我在iframe中加载的内容包含指向“阻止”的外部网站的链接，如果我使用允许用户浏览所有图库项目的常规上一个和下一个导航。

如何更改prev / next链接覆盖的大小，使其包含在左右边距中，以便我可以将内容链接公开给用户？

OR

另一种方法是，如果有一种方法可以将按钮导航栏相对于FancyBox的顶部而不是相对于页面顶部进行定位。在这种情况下，我将禁用内部上一个/下一个链接和箭头。

Answer 1

编辑：如果您想更改prev / next叠加层的大小，请添加此CSS内联声明 AFTER 您加载了fancybox CSS文件：

<style type="text/css">
.fancybox-nav {
  top: 50%;
  height: 34px;
  width: 36px;
 }
.fancybox-nav span {
  visibility: visible;
 }
.fancybox-next span {
  left: auto;
  right: 0px;
 }
.fancybox-prev span {
  left: 0px;
 }
</style>

请注意，您必须永久显示箭头，否则访问者将不知道将鼠标悬停在哪里。

注意：这适用于fancybox v2.0.6 +

另一方面，您无法相对于FancyBox顶部设置按钮导航栏，因为它有一个position:fixed，并且会附加到body标记。

但是，您可以尝试编辑fancybox-buttons js文件（第69行+/-）并将其附加到.fancybox-skin选择器，然后使用css播放#fancybox-buttons选择器的位置

在iFrame中更改FancyBox2上一页和下一页叠加层的大小？

1 个答案: