PiRSquared17 / fancybox

Automatically exported from code.google.com/p/fancybox
0 stars 0 forks source link

Multiple galleries on single page #71

Closed GoogleCodeExporter closed 9 years ago

GoogleCodeExporter commented 9 years ago
I've scoured the web for help on this.  I've seen several people asking the
same question, but never an answer.

I would like to have multiple galleries on a single page.  For example, 40
thumbnails, with 3 images showing up in the gallery.  The only way I know
how to do this is by copy/paste the current REL=EXAMPLE_GROUP code and
making it REL=EXAMPLE_GROUP2, for example.

I'll probably switch to lightbox if I can't get it figured out.  But any
help would be much appreciated!!

------------

<script type="text/javascript">
        $(document).ready(function() {

            $("a[rel=example_group]").fancybox({
                'transitionIn'      : 'elastic',
                'transitionOut'     : 'elastic',
                'titlePosition'     : 'outside',
                'titleFormat'       : function(title, currentArray, currentIndex, currentOpts) {
                    return '<span id="fancybox-title-over">Image ' + (currentIndex + 1) +
' / ' + currentArray.length + (title.length ? ' &nbsp; ' + title : '') +
'</span>';
                }
            });

        });
    </script>

<div id="content">
<a rel="example_group"
href="http://farm5.static.flickr.com/4061/4259390534_3e6c926504.jpg"
title="Client Name">Set One</a>
<a rel="example_group"
href="http://farm3.static.flickr.com/2561/4048285842_90b7e9f8d1.jpg"
title="Client Name"></a>
<a rel="example_group"
href="http://farm3.static.flickr.com/2641/4163443812_df0b200930.jpg"
title="Client Name"></a>

<a rel="example_group"
href="http://farm3.static.flickr.com/2591/4135665747_3091966c91.jpg"
title="Client Name">Set Two</a>
<a rel="example_group"
href="http://farm3.static.flickr.com/2561/4048285842_90b7e9f8d1.jpg"
title="Client Name"></a>
<a rel="example_group"
href="http://farm3.static.flickr.com/2591/4135665747_3091966c91.jpg"
title="Client Name"></a>
</div>

Original issue reported on code.google.com by jstnwt...@gmail.com on 17 Mar 2010 at 2:42

GoogleCodeExporter commented 9 years ago

Original comment by janis.sk...@gmail.com on 18 Mar 2010 at 8:35

GoogleCodeExporter commented 9 years ago
[deleted comment]
GoogleCodeExporter commented 9 years ago
add 

class="grouped_elements"

right before

rel

and call the script:
    $("a.grouped_elements").fancybox();

Original comment by ltdan1...@gmail.com on 18 Jan 2012 at 6:32