• Registered: 2014-04-19
  • Posts: 16

Topic: Multiple galleries

Hi all !

I would like to know how to make a page with two or more galleries on it. I've seen the demo page for the splash page and it gave me the idea to do the same thing but with all my galleries !

the splash page demo: http://www.juicebox.net/demos/pro/splash/

Problem is a gallery is always refering to stuff that have the same name e.g: the folders image and jbcore, the thumbs...

I tried to put all that in a sub level but some path are broken (maybe those in the js code that I can't change).



I work with dreamweaver in Html and Css but I don't know anything about Javascript.
Someone has an idea to get this fixed ?
Thanks !

  • Registered: 2012-04-24
  • Posts: 5,924

Re: Multiple galleries

Please see the Multiple Galleries on One HTML Page example in the Embedding Multiple Galleries support section. You can view the source of the web page in your browser and copy/modify it to suit your own needs.

Essentially, you would keep each gallery in its own separate folder (to avoid the risk of duplicate file names in the same directory), upload the complete gallery folders to your web server and embed the galleries in your web page using the baseUrl method of embedding as documented here.

If you run into any problems, please post the URL top your web page so that I can take a look and help further.

  • Registered: 2014-04-19
  • Posts: 16

Re: Multiple galleries

Oh Steven...
....Always here when you need him !

4 Reply by Tiphaine (edited by Tiphaine 2014-05-23 08:12:41)

  • Registered: 2014-04-19
  • Posts: 16

Re: Multiple galleries

I've been working all day on a new gallery: www.pr1v4t3sp0ts.com/JeFaisSouventCeRêve/index.html


I really like the design but my problem now is that the galery expand in the back of the content. It seems that there is a conflict between the galleries and the header. Indeed, I used z-index in order to let the content pass behind the header when we scroll down. to me the problem comes from here.

Two questions:

-Am I right, is this a z-index problem ? (my stylesheet: http://www.pr1v4t3sp0ts.com/JeFaisSouve … esheet.css)

-What can I do ? :D

Edit:I have deleted all the z-index things but the galleries now display between my header and the other galleries...

Edit: I found that line of code was the problem: expandedBackgroundColor="rgba(255,255,255,0.2)"in the xml file of a gallery. It seems to be a matter of transparency because it work well when transparency is set to 1. You can see the difference already: the SPORT gallery is set to 1 whereas the other are untouch (0.2 opacity).... www.pr1v4t3sp0ts.com/JeFaisSouventCeRêve/index.html


How the demo do to work with transparency ?

  • Registered: 2012-04-24
  • Posts: 5,924

Re: Multiple galleries

There are two relatively easy solutions to your problem. Either:
(1) Use an opaque (rather than transparent) expandedBackgroundColor. For example, try setting expandedBackgroundColor="rgba(255,255,204,1)" rather than expandedBackgroundColor="rgba(255,255,204,0.2)". This will ensure that no elements from your web page are visible when the gallery is expanded.
... or:
(2) Set expandInNewPage="TRUE" (in JuiceboxBuilder-Pro's 'Customize -> General' section). When the gallery is expanded from the Splash Page, it will be displayed on a page of its own rather than on top of the embedding page.