One Page, multiple galleries out of inline-HTML??

classic Classic list List threaded Threaded
4 messages Options
Reply | Threaded
Open this post in threaded view
|

One Page, multiple galleries out of inline-HTML??

muetzenflo
Hi all!

i am trying to get something like this to work (<aa = normal <a):


<aa class="detailarea gallery-1">somehtmlcodehere</aa>
<aa class="detailarea gallery-1">somehtmlcodehere</aa>

<aa class="detailarea gallery-2">somehtmlcodehere</aa>
<aa class="detailarea gallery-2">somehtmlcodehere</aa>

$('.detailarea').click(function() {
        Shadowbox.open({
                content:    $(this).html(),
                player:     "html",
                height:     240,
                width:      420
        });
});



i'd like to create multiple galleries on one page.
The content of every gallerypage is inline-htmlcode.
But how can i:
- logically connect the galleries
- display the inline-html of each gallery-element

hope my problem is clear...maybe i have to create one click-listener for every gallery??
And how does a "non-clicked" gallery-element know that it should display its "$(this).html()" as content?

thanks for any help!!
flo
Reply | Threaded
Open this post in threaded view
|

Re: One Page, multiple galleries out of inline-HTML??

HenzeBerkheij
i'm not sure wat you want to do..but you can simply do like this

add the stuff to a gallery:

Shadowbox.gallery = [{
                content:    $(this).html(),
                player:     "html",
                height:     240,
                width:      420
        },
        {
                content:    $(this).html(),
                player:     "html",
                height:     240,
                width:      420
        }];

and create function you can put in the onclick of your urls

function openShadowbox(id){
     Shadowbox.open(Shadowbox.gallery[id]);
}

at least, this is the idea!
Reply | Threaded
Open this post in threaded view
|

Re: One Page, multiple galleries out of inline-HTML??

muetzenflo
Hi Henze!

That should help me to solve at least 50% of my problem, thanks for that! I didn't know about how to use the gallery-Array.

But i don't know how to solve the last problem: I'm not sure how to logically connect the gallerie-items. let's say i have 2 galleries on the page, each with 3 pages:

<div onclick="openGallery(1);">html of page 1 of gallery 1</div>
<div onclick="openGallery(1);">html of page 2 of gallery 1</div>
<div onclick="openGallery(1);">html of page 3 of gallery 1</div>

<div onclick="openGallery(2);">html of page 1 of gallery 2</div>
<div onclick="openGallery(2);">html of page 2 of gallery 2</div>
<div onclick="openGallery(2);">html of page 3 of gallery 2</div>

if i now click on the first div, how do i tell shadowbox where it can find the other 2 pages of gallery 1?? How does shadowbox know where to find the content of the second page of the current gallery?

I somehow have to group the first three divs so shadowbox knows:
a) these three divs form a gallery
b) $(this).html() corresponds to the html-code within each of the three divs


i hope the problem is now described a little bit better. I'm pretty sure the solution is quite easy, but i can't find it :(
thanks,
flo
Reply | Threaded
Open this post in threaded view
|

Re: One Page, multiple galleries out of inline-HTML??

HenzeBerkheij
i See..you can also create two variables with the array and do like this:

openGallery(galleryid, objId){
    if(galleryid==1){
        Shadowbox.gallery = gallery1;
    }elseif(galleryid==2){
        Shadowbox.gallery = gallery2;
    }
    shadowbox.open(Shadowbox.gallery[objId]);

}