当我点击'.fancybox-button'同时保持相同的花式框设置时,如何打开'.fancybox'打开的相同galery?
<div class="custom-thumbnail"><a class="fancybox" rel="group" href="Gallery/Image3.jpg"><img title="Bird Caption" src="Gallery/_t/testImage3_jpg.jpg"></a></div>
<div class="custom-caption"><a class="fancybox-button" rel="fancybox-button" href="Gallery/testImage3.jpg">Click here to open gallery</a></div>
这是我管理fancybox属性的代码
jQuery(".fancybox").fancybox({
maxWidth : 800,
maxHeight : 600,
fitToView : false,
width : '100%',
height : '100%',
title: this.title,
wmode: 'transparent',
allowfullscreen : 'true',
allowscriptaccess : 'always',
beforeLoad: function() {
this.title = jQuery(this.element).find('img').attr('title');
},
next : {
13 : 'left', // enter
34 : 'up', // page down
39 : 'left', // right arrow
40 : 'up' // down arrow
},
prev : {
8 : 'right', // backspace
33 : 'down', // page up
37 : 'right', // left arrow
38 : 'down' // up arrow
},
close : [27], // escape key
helpers: {
title : {
type : 'inside' // 'float', 'inside', 'outside' or 'over'
},
overlay : {
showEarly : false
},
thumbs : {
width: 50,
height: 50
}
}
});
答案 0 :(得分:2)
这对我有用。你们怎么看待这个解决方案?
jQuery('.fancybox-button').click(function(){
jQuery(this).parent().prev().find('.fancybox').trigger('click');
return false;
});
答案 1 :(得分:0)
编辑:感谢@JFK,我终于明白了什么是OP的问题。是的,OP的解决方案似乎没问题:)
FancyBox通过类定义fancybox
激活自身。所以,你的锚标签打开fancybox窗口(div.custom-thumbnail中的那个)的原因是它有一个fancybox
类。如果您为fancybox-button
定义了不同的css属性,则可以在其附近添加fancybox
类。或者,只需将fancybox-button
更改为fancybox
,就可以了。
我为你创建了一个fiddle。我改变的唯一一件事就是将“fancybox-button”类改为“fancybox”并且它有效。
通过在fancybox-button类附近添加一个单独的fancybox类也可以。请参阅更新的fiddle。