Search code examples
javascriptjqueryfancyboxfancybox-2

How to group images on multi galleries with FANCYBOX?


How to group galleries to show only photos from same group?

Right now getting images via data-fancybox the problem is that i have dynamical id of group.

fancybox version: v3.5.7

<a class="fancyfunc" data-fancybox-group="group_<?=$r['reference_id'];?>"  href="<?=$img['image'];?>"  data-fancybox="images">
   <img class="none" src="<?=$img['image'];?>" />
</a>
$('[data-fancybox="images"]').fancybox({

    margin : [44,0,22,0],
    thumbs : {
        autoStart : true,
        axis      : 'x'
    }
})

Solution

  • See docs - https://fancyapps.com/fancybox/3/docs/#usage -

    [..] use the same attribute data-fancybox value for each of them to create a gallery.

    So, replace

    data-fancybox-group="group_<?=$r['reference_id'];?>"

    with

    data-fancybox="group_<?=$r['reference_id'];?>"