如何使用fancyBox创建幻灯片？

Question

我在http://www.spanish-bookworld.com/fancybox_demo.html

创建了两个图片库

鼠标悬停时图像上缺少“下一步”按钮让我担心。我的观众是计算机文盲，他们中的大多数人都不会看到画廊中有更多的图像。

我估计我有两个选择。一种是在图像上永久使用“下一步”按钮，另一种是使用幻灯片显示。

不幸的是，我无法弄清楚如何编写任何解决方案。

任何线索？感谢。

Answer 1

正如fancybox文档在其按钮示例（http://jsfiddle.net/Xh3B2/）中所述，您应该尝试将fancybox navigaton上的CSS设置为visible（然后使用CSS设置它们的位置）。

对于您的示例，您应首先使用此类CSS来设置导航始终可见，然后设置下一个/上一个按钮位置。

.fancybox-nav {
width: 60px;       
}
.fancybox-nav span {
visibility: visible;
opacity: 0.5;
} 
.fancybox-nav:hover span {
opacity: 1;
}
.fancybox-next {
right: -60px;
}
.fancybox-prev {
left: -60px;
}

对于幻灯片显示选项，您应将fancybox脚本设置为“autoPlay = true。默认值设置为”false“，这会使幻灯片显示无效。