Question

I just asked several days ago about fancybox manual call to a specific target

now I have a further problem. I like to implement more than one fancybox gallery. The first gallery works well. But when I include a second one (e.g. code:)

    $("#manual1").click(function() {
        $.fancybox([
            'http://farm5.static.flickr.com/4044/4286199901_33844563eb.jpg',
            'http://farm3.static.flickr.com/2687/4220681515_cc4f42d6b9.jpg',
            {
                'href'  : 'http://farm5.static.flickr.com/4005/4213562882_851e92f326.jpg',
                'title' : 'Lorem ipsum dolor sit amet, consectetur adipiscing elit'
            }
        ], {...
        });
    });
$("#manual2").click(function() {
        $.fancybox([
            'http://farm5.static.flickr.com/4044/4286199901_33844563eb.jpg',
            'http://farm3.static.flickr.com/2687/4220681515_cc4f42d6b9.jpg',
            {
                'href'  : 'http://farm5.static.flickr.com/4005/4213562882_851e92f326.jpg',
                'title' : 'Lorem ipsum dolor sit amet, consectetur adipiscing elit'
            }
        ], {...
        });
    });

the second gallery includes the pictures from the first. So in this example I will have a first gallery (#manual1) with 3 pictures and a second gallery (#manual2) with 6 pictures. But I like to have only 3 pics in the second one. (And a third one is even worse).

How can I solve this problem? $.fancybox().removeData(); doesn't work as well as $('something_in_here').fancybox( does not help.

Was it helpful?

Solution

If you copy the same code and only change the selector, of course you will have the same information.

Here is where you define what pictures for each gallery

$.fancybox([
            'http://farm5.static.flickr.com/4044/4286199901_33844563eb.jpg',
            'http://farm3.static.flickr.com/2687/4220681515_cc4f42d6b9.jpg',
            {
                'href'  : 'http://farm5.static.flickr.com/4005/4213562882_851e92f326.jpg',
                'title' : 'Lorem ipsum dolor sit amet, consectetur adipiscing elit'
            }
        ],

so change the path accordingly for each gallery

http://newSite.com/newPath/newImage.jpg

OTHER TIPS

Just guessing here, but the scope isn't defined...what if you tried something like $(this).fancybox([

Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top