Calling gallery from JS function

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

Calling gallery from JS function

gilbar
I'm using shadowbox for a portfolio site. Depending on the needs of the piece displayed, I call a function that will either a)open a link b)open a flash/img file or c)open a gallery.

I have no idea how to implement c)open a gallery. Here is my function:

function Launch(type,ref,p,t,w,h){
        if(type=="site"){
                window.open (ref,"new");
        } else if(type=="modal"){
                Shadowbox.open({
                        player:     p,
                        title:      t,
                        content:    ref,
                        height:     h,
                        width:      w
                });
               
        } else if(type=="gallery"){

        }
       
       
}


What parameters do I need to pass for a gallery? I'm not doing the onload init right now. I don't have links for the images as there's no need for them. I tried putting the images in  tags as part of a hidden div and then call that gallery name but that didn't work.

Any thoughts?


Reply | Threaded
Open this post in threaded view
|

Re: Calling gallery from JS function

Wizzud
Thoughts :

1. Without running Shadowbox.init(), Shadowbox will not work
2. Shadowbox works on A and AREA tags; without using these tags you do not have 'gallery' capability
3. Running Shadowbox.setup() - either as part of init(), or in its own right - would cache your shadowbox media, and (a) enable open() to be called with just the trigger element, and (b) enable the 'gallery' capability.

If you could expand your example somewhat, it would help in determining exactly what it is you are trying to achieve?
Combine literacy with curiosity and a whole world of information opens up to you
Reply | Threaded
Open this post in threaded view
|

Re: Calling gallery from JS function

dreipunktnull
Hi,
I'm having the same problem. I know I can open a gallery by adding something like [gallery] to the rel tag. What I - and I guess the thread starter also - want to achieve is to open a gallery by adding some link to an object that is not part of the gallery like

<a href="javascript:gallery('fotos')">Open the gallery</a>.

I have already created the correct links with rel tags and added style="display: none" to make them accessable in the DOM.

Thanks in advance and best regards.
Reply | Threaded
Open this post in threaded view
|

Re: Calling gallery from JS function

Wizzud
If the gallery elements have already been set up in Shadowbox - which you imply that they have - then calling Shadowbox.open(Element) on a triggering link Element should open the relevant media in gallery mode.

Eg (jQuery)...

Shadowbox.init();
var theGallery = $('#Gallery a');
$('#startGallery').bind('click', function(){ Shadowbox.open(theGallery[0]); return false; });


< a id='startGallery' href='javascript:void(0);'>Gallery< /a>
< div id='Gallery' style='display:none;'>
< a href='tom.img' rel='shadowbox[gallery]'>tom< /a>
< a href='dick.img' rel='shadowbox[gallery]'>dick< /a>
< a href='harry.img' rel='shadowbox[gallery]'>harry< /a>
< /div>


There are other ways of coding it of course, and other syntaxes for different libraries.
If you don't use a library, use onclick in the visible link, and an id in 1 (or all) of your hidden links.

Combine literacy with curiosity and a whole world of information opens up to you
Reply | Threaded
Open this post in threaded view
|

Re: Calling gallery from JS function

dreipunktnull
Thanks a lot. That's exactly what I was looking for. I'll give it a try. Commercial license is bought by the way.
Reply | Threaded
Open this post in threaded view
|

Re: Calling gallery from JS function

dreipunktnull
Unfortunately it doesn't work completely. Firebug throws 'setting a property that has only a getter' after shadowbox opens and resizes the overlay.

I Include all required Scripts by <link ...> in the header and initialize shadowbox by  

jQuery(document).ready(funtion() {Shadowbox.init});

I set up a hidden div with id="gallery" containing the links to the images with rel tags and try to open the gallery by calling this function:

function gallery() {
 items = $('#gallery a');
 Shadowbox.open(items[0]);
 return false;
}

When I click the links directly in the hidden div all works fine.

Thanks a lot in advance.

EDIT: Never mind. Using an older version of shadowbox (I think it's the latest from 1.x branch) works as designed and is fine for me.

Reply | Threaded
Open this post in threaded view
|

Re: Calling gallery from JS function

gilbar
Excellent, that works for me too. For reference, my final markup looked like this:

<div id="gallery" style="display:none;">
       
       
       
       
</div>
<div class="zoom" onClick="Launch('gallery','gallery','img','Title',600,450)">View Details</div>


function Launch(type,ref,p,t,w,h){
        if(type=="site"){
                window.open (ref,"new");
        } else if(type=="modal"){
                Shadowbox.open({
                        player:     p,
                        title:      t,
                        content:    ref,
                        height:     h,
                        width:      w
                });
               
        } else if(type=="gallery"){
                items = $('#gallery a');
  Shadowbox.open(items[0]);
        }
}


If anyone can improve/optimize this it would be great to hear about it. As a feature request it would be nice to just reference a directory and have shadowbox treat it as a gallery. :)

Cheers!