我使用fancyBox 2来显示iframe内容组。我可以使用键盘上的箭头浏览内容,并通过点击内容的右侧或左侧,但无法显示箭头。我甚至将箭头设置为始终可见,而不是悬停,仍然没有运气。我将在某些iframe中使用可点击的内容,因此我需要关闭点击内容中导航的任何位置的功能。该选项也会干扰滚动条。Fancybox 2箭头不显示
这里是我的代码
<!-- 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>
任何帮助表示赞赏!谢谢!
可能链接在CSS定义图像不正确或图像不存在在指定的位置 – Rafay 2013-03-08 22:35:49
的fancybox精灵png文件应位于fancybox css文件的相同目录 – JFK 2013-03-09 06:21:04