Fancybox next / prev not working

我有这个html，在图像的链接上设置了data-fancybox-group属性，就像在演示中启用下一个/上一个但它不起作用。 我包括按钮js和css，它们正确加载，所以我不知道它为什么不起作用。 有人可以帮忙吗？

 
 
 
Amy Robbins
 
 
    
 
 Show image 
 
 
 
 
Indrias Getachew
 
 
    
 
 Show image 
 
 
 
 
DSC 0103
 
 
    
 
 Show image 
 
  

除了这个以外，脚本工作得很好，这里是js：

 $('.homepnl.photo li, .gallery.photos li, .lb-photos').each(function(i,itm){ var photolink = $('.photocontent a',$(itm)).attr('href'); // var title = $('.wp-caption-text',$(itm)).text(); $('a',$(itm)).click(function(evt){ evt.preventDefault(); }); // $(itm).attr('title',title); $(itm).attr('href',photolink); $('.photocontent p a').attr(data-fancybox-group','gallery'); //applying the fancybook plugin to the item. $(itm).fancybox({href:photolink, 'autoDimensions': true }); 

}）;

这个截止日期是昨天，所以任何帮助都非常感谢！

该页面在这里： http ： //nduna.demo.provokateur.com/media-center/

Answer 1

fancybox OLDER比2.0 VS fancybox 2.0+

Fancybox OLDER比2.0（ http://fancybox.net/ ）

• 似乎只支持rel attrubute进行分组

Fancybox 2.0+（ http://fancyapps.com/fancybox/ ）

• 支持= rel属性&& data-fancybox-group属性

因此，如果你使用的是旧版本的fancybox，这可能是你的问题:)

Answer 2

我认为你缺少的是锚标签上匹配的“rel”属性。 从Fancybox文档（ http://fancybox.net/howto ）：

注意 – 库是从具有相同“rel”标记的元素创建的，例如：

 /* HTML */     /* This will create two galleries */ $("a.grouped_elements").fancybox(); 

编辑：

所以从你的代码中，你可以做这样的事情（对于你的所有图像）：

编辑2

当我在页面的控制台中运行以下代码时，它会为每个图像添加下一个/上一个按钮。 我不是100％肯定fancybox是如何工作的，但是在启动器中使用jQuery的.attr（）选择器可能存在问题。

 jQuery('.photocontent p a').data('fancyboxGroup','gallery').fancybox();