How to create separate Fancybox galleries on the same page?

by

Just assign a different rel attribute to each gallery

<a class="fancybox" rel="gallery01" href="https://stackoverflow.com/questions/9486034/product01/image01.jpg">one</a>
<a class="fancybox" rel="gallery01" href="product01/image02.jpg">one</a>
<a class="fancybox" rel="gallery01" href="product01/image03.jpg">one</a>
<a class="fancybox" rel="gallery01" href="product01/image04.jpg">one</a>

<a class="fancybox" rel="gallery02" href="product02/image01.jpg">two</a>
<a class="fancybox" rel="gallery02" href="product02/image02.jpg">two</a>
<a class="fancybox" rel="gallery02" href="product02/image03.jpg">two</a>

<a class="fancybox" rel="gallery03" href="product03/image01.jpg">three</a>
<a class="fancybox" rel="gallery03" href="product03/image02.jpg">three</a>
<a class="fancybox" rel="gallery03" href="product03/image03.jpg">three</a>

… and they all can use the same script:

$(".fancybox").fancybox();

More Related Contents:

  1. Fancybox doesn’t work with jQuery v1.9.0 [ f.browser is undefined / Cannot read property ‘msie’ ]
  2. Fancybox links don’t show in lightbox – what am i missing?
  3. call Fancybox in parent from iframe
  4. Delay pop-up for 10 seconds, only pop up once
  5. How do I hide the tooltip on hover from the title tag when using FancyBox 2.0?
  6. jquery fancybox 2.0.3 – prevent close on click outside of fancybox
  7. HTML Attribute rel Errors using fancyBox
  8. fancy box work with iframes in beforeShow function?
  9. Fancybox stuck loading iframe in IE
  10. Unable to load google in iframe in fancybox
  11. How to create a direct link to any fancybox box
  12. How to launch jQuery Fancybox on page load?
  13. How do you resize Fancybox at runtime?
  14. Fancybox: iframe doesn’t work
  15. Fancybox2 – different content for tooltip and image title, both from title attribute?
  16. Can Fancybox be responsive only horizontally for tall content?
  17. Open YouTube video in Fancybox jQuery
  18. jQuery UI DatePicker – Change Date Format
  19. Select element by exact match of its content
  20. jquery data selector
  21. Should jQuery’s $(form).submit(); not trigger onSubmit within the form tag?
  22. Use Jquery Selectors on $.AJAX loaded HTML?
  23. What are the drawbacks of using synchronous ajax call?
  24. Validate fields using JQuery validation without any submit?
  25. jquery scroll, change navigation active class as the page is scrolling, relative to sections
  26. HTML5 validation before ajax submit
  27. Updating jQuery Tablesorter plugin after removing a row from DOM
  28. jQuery html attribute not working in IE
  29. Load content with ajax in bootstrap modal
  30. Can jQuery selectors be used with DOM mutation observers?

Leave a Comment