FancyBox 2.1.4 / jQuery - Can I use one Thumbnail to link to Photo Gallery?

jquery fancybox-2
RayMysterio picture RayMysterio · May 9, 2013 · Viewed 7.1k times · Source

I'm using FancyBox 2.1.4 and jQuery,

Is it possible to have only one Thumbnail on an HTML Page that points to an entire FancyBox Photo Gallery that consists of more than one photo?

So when one click on that one Thumbnail it will launch a FancyBox Photo Gallery over the existing HTML Page that can be viewed.

By default one needs all the Thumbnails on the one HTML Page and if you then click any one it will open that one and you can click Left or Right to view the other photos.

My logic behind this: On the HTML Page there's info. about a place (a residential complex), and on that page I want to place only one Thumbnail and call it "Photo Gallery of the Complex", so when someone clicks on that one Thumbnail it launches the FancyBox Photo Gallery Slideshow with all the photos.

Thanks for any help,

Reinhard.

Answer

ndimatteo picture ndimatteo · Jul 17, 2013

I know I'm 2 months late to the party, but I had a similar situation that needed worked out and while the example on the FancyBox website is useful, it's a bit impractical to include all those links to images only to hide them (look out for a heavy page load!).

I did some tweaking and noticed that all that's really needed is the <a> tags with the rel attribute. I cleaned up the example, removing the js that adds the same rel attribute to everything, and adding another gallery to show how it could work: http://jsfiddle.net/uZCC6/3005/

Hope this helps anyone else!

Related questions

Fancybox doesn't work with jQuery v1.9.0 [ f.browser is undefined / Cannot read property 'msie' ]

Fancybox breaks with the new jQuery v1.9.0. It affects both, Fancybox v1.3.4 and below - and - v2.1.3 and below. The errors shown are : v1.3.4 : Timestamp: 15/01/2013 10:03:28 AM Error: TypeError: b.browser is undefined Source File: ...fancybox/jquery.fancybox-1.3.4.pack.js …

Read More
fancybox2 / fancybox causes page to to jump to the top

I have implemented fancybox2 on a dev site. When I engage the fancybox (click the link etc) the whole html shifts behind it - and goes to the top. I have it working fine in another demo, but when I …

Read More
how to prevent scrolling of page behind fancybox-2

We are using fancybox2 for displaying images. Everything works well, but when the larger image is displayed in the fancybox, the page behind scrolls to the top. After closing the fancybox the user has to scroll back downwards to the …

Read More