fancyapps/fancyBox — Issue #130: Changing dynamically data-fancybox-group
Author: nofx77
Created: 2012-02-01 14:38:55+00:00
State: open

Hi, guys,

I have a huge gallery off images with a filter system that's highlight only images that I choose from the filter. So when a I set a filter on my gallery I change dynamically the data-fancybox-group to make a gallery only between the image that I filter but Fancybox seem to don't like it...

So when i switched the filter when I try to click on a images after a filter change the fancybox dosen't work at all. Anybody have a clue on that?

Thanks!

Here is the code of Fancybox :

$(".fancybox").fancybox({
openEffect	: 'fade',
closeEffect	: 'fade',
prevEffect : 'fade',
nextEffect : 'fade',
prevSpeed : 'normal',
nextSpeed : 'normal',
arrows : true,
closeBtn : true
});

Here my filter code :

//Click on a filter
$(".menu-gallery li a").click(function (){
//My filter menu have a id's
var thisID = this.id;
//Loop in the gallery to show or hide the filter image with the selected filter
$(".list-item li div").each(function(){

if ( $(this).hasClass(thisID) ) {

$(this).removeClass('hide');

//Change the data group on the fly to make a gallery only with the selected filter image
$("a", this).attr('data-fancybox-group',thisID);

} else {

$(this).addClass('hide');

}

});

});