1

我正在使用 fancyBox 2 来显示 iframe 内容组。我可以使用键盘上的箭头并单击内容的右侧或左侧来浏览内容,但我无法显示箭头。我什至将箭头设置为始终可见,而不仅仅是悬停,仍然没有运气。我将在某些 iframe 中包含可点击的内容,因此我需要能够关闭点击内容中任意位置进行导航的功能。该选项也会干扰滚动条。

这是我的代码

<!-- Add jQuery library -->
<script type="text/javascript" src="http://code.jquery.com/jquery-latest.min.js"></script>

<!-- Add fancyBox -->
<link rel="stylesheet" href="../../../scripts/fancybox/source/jquery.fancybox.css?v=2.1.4" type="text/css" media="screen" />
<script type="text/javascript" src="../../../scripts/fancybox/source/jquery.fancybox.pack.js?v=2.1.4"></script>

<link rel="stylesheet" href="../../../scripts/fancybox/source/helpers/jquery.fancybox-thumbs.css?v=1.0.7" type="text/css" media="screen" />
<script type="text/javascript" src="../../../scripts/fancybox/source/helpers/jquery.fancybox-thumbs.js?v=1.0.7"></script>

<script type="text/javascript">
    $(document).ready(function() {
    $(".fancybox").fancybox({
        fitToView   : false,
        autoSize    : false,
        closeClick  : false,
        openEffect  : 'none',
        closeEffect : 'none',
        showArrows  : true,
        arrows      : true,
        type        : 'iframe',
    });
});
</script>

和 HTML

<a class="fancybox" rel="andyAdams" href="andyadams/one.html"><img src="thumbnailImages/adams1.jpg" height="150" width="150" alt="Andy Adams" /></a>

<a class="fancybox" rel="andyAdams" href="andyadams/two.html"><img src="thumbnailImages/adams2.jpg" height="150" width="150" alt="Andy Adams" /></a>

<a class="fancybox" rel="andyAdams" href="andyadams/three.html"><img src="thumbnailImages/adams3.png" height="150" width="150" alt="Andy Adams" /></a>

<a class="fancybox" rel="andyAdams" href="andyadams/four.html"><img src="thumbnailImages/adams4.jpg" height="150" width="150" alt="Andy Adams" /></a>

任何帮助表示赞赏!谢谢!

4

2 回答 2

0

关闭图标是否显示?箭头和关闭按钮都在fancybox_sprite.png. 图像精灵的文件位置(在 CSS 中用于background-imageon和其他)很可能是不正确的。.fancybox-close尝试使用绝对 URL 而不是相对 URL。(http://example.com/fancybox_sprite.png而不是../fancybox_sprite.png

于 2013-03-08T23:02:56.643 回答
0

我有同样的问题。我最初厌倦了将图像放在不同的文件夹(不是 css 文件夹)并使用 css url 链接它们......它没有工作......但是当我把图像放在同一个 css 文件夹中......它工作了……你应该试试……

于 2013-05-05T14:55:05.893 回答