Multiple image galleries within a gallery

[andyhughes73]

I have just installed the gallery plugin and I am trying to make it so that I have a grid of images and each image represents its own image gallery, with multiple images.

For example, I have a 3 x 3 grid of images of cars. When I click on the first image, I want it to display the image in the popup and then give me arrows to view the other images within that gallery. These additional images will of course be hidden and only visible when the lightbox is cycled through.

I have looked through the install documentation but I can't find an example for this. I have also tried a combination of your "hidden" example to see if that would work but it doesn't.

Have I missed something obvious or is this indeed an issue? If so, how would I create this functionality as I need it and I think it's quite a common need.

Thanks.

[ashleydw]

see http://ashleydw.github.io/lightbox/#hidden-elements

[andyhughes73]

In the hidden-elements example, each image in the visible gallery just uses the hidden images i.e. if I click on the first image, it just scrolls through the images and the hidden images. The second image then does the same, scrolling through the hidden images. In essence, the visible images are just a link through to all of the same hidden images. That's not what I'm trying to achieve.

I want to be able to have the first image with it's own set of hidden images. Then the second image will have its own set of hidden images.

How do I achieve that using your hidden-elements example.

Thanks

[andyhughes73]

Ok I worked it out, all good. I think it would be good to revise your demo section for the hidden objects bit though to make it a bit simpler for those copy and pasters like me. :)

If you could include some hidden images under each of their respective main images so people can clearly see how to set up each sub gallery, I think it would help i.e. image one with it's hidden images, image two with its hidden images etc.

Thanks for the help. :)

[RaidoS]

Hi guys its tiny simple to wrapp galleries via data-gallery attribute. just set unique values for each gallery like so: hidden-images-{{item.id}}

[rootcstar]

Can you tell me how you used this on your code. I am trying to do but i cant.

[andyhughes73]

@sammyoguzhan - Go to this page http://www.burtonbodyworks.co.uk/gallery.php and then copy my gallery code.

• Change the images for yours.
• Insert the correct version of jQuery. You might need to test different version if the gallery doesn't work the first time. Conflict in script versions is a common problem.
• Insert the relevant gallery css and script files from Github.
• Look at the very bottom of my gallery page for the script that calls the actual gallery.
• Remember to give each gallery section it's own unique name using the data attribute.

If you have a live version of your page, drop a link and I'll have a look if it's not working.