如何将使用Roundabout制作的图库与Fancybox集成？

我正在尝试使用Roundabout插件创建一个紧凑的图库。

旋转木马应旋转缩略图，并且仅对于当前聚焦的图像，单击时在Fancybox弹出窗口中打开较大的图像。

这就是标记的样子：

问题是，如果我尝试在图像上激活Roundabout和Fancybox，点击它们将触发旋转和弹出，无论我点击哪个图像。 相反，弹出窗口应仅对当前焦点的图像有效。
我无法取消绑定缩略图上的click事件，因为这也会禁用旋转。这是一个示例页面的链接 （图库位于页面底部）。

编辑：
这是在页面加载上运行的jQuery：

 $(function() { $('ul.image-gallery').roundabout({ duration: 1200 }); $('ul.image-gallery a').fancybox(); }); 

Answer 1

好的，在检查了你提到的页面之后，焦点图像有了关于焦点的类，所以下面可以解决这个问题。 试试吧

 $(function() { $('ul.image-gallery').roundabout({ duration: 1200 }); //$('ul.image-gallery .roundabout-in-focus a').fancybox(); }); 

编辑：尝试映射聚焦图像链接的单击事件，并手动打开链接URL的fancybox。 同时删除上述function中的fancybox映射。 （我在代码中评论过它）

 $('ul.image-gallery .roundabout-in-focus a').live('click',function(event){ event.preventDefault(); $.fancybox({'href':$(this).attr('href')}); }) 

Answer 2

除了你的选择之外

 $('ul.image-gallery').find('li').focus(function() { $(this).find('a').fancybox.cancel(); } }); 

这假定您在ul上使用环形交叉口，并在其内部的锚标签上使用fancybox。 当环形交叉口将焦点放在li上时，它会取消将执行相同操作的fancybox。