Thanks!

Managed to make it work as I wanted with the modified small javascript found in the second link :)

Hi!

Page here:
http://www.kareinen.fi/tuotteet.php?pag … npaa-korut

I have problems when trying to make the height responsive. So when I resize the browser window smaller the gallery should go less tall. This doesn't happen without problems.

I have this in PHP-page:

<!--START JUICEBOX EMBED-->
<script src="galleriat/jbcore/juicebox.js" type="text/javascript"></script>
<script>
new juicebox({
configUrl  : "galleriat/uudet_tyot.php",
containerId : "juicebox-container",
galleryWidth: "100%",
galleryHeight: "100%",
backgroundColor: 'rgba(248,248,248,1)'
});
</script>
<div id="juicebox-parent">
    <div id="juicebox-container"></div>
</div>
<!--END JUICEBOX EMBED-->

In CSS are following lines:

#juicebox-parent{
    height:400px;}

#juicebox-content{
    width:100%;}

In gallery's settings file:

galleryWidth="100%"
galleryHeight="100%"

When I change #juicebox-parent{height:400px} to max-height:400px gallery goes to as tall as the window is.

Any quick help? :)

Thanks, worked perfectly!

I have couple galleries made with Juicebox Pro and Flickr on here:

http://www.kareinen.fi/kuvat.php?page=kaikki

Currently I have simple php-file for each gallery that are loaded dynamically:

<!--START JUICEBOX EMBED-->
<script src="galleriat/jbcore/juicebox.js" type="text/javascript"></script>

<script>
new juicebox({
configUrl : "galleriat/elaimet.xml",
containerId : "juicebox-container",
galleryWidth: "500",
galleryHeight: "450",
backgroundColor: 'rgba(248,248,248,1)'
});
</script>
<div id="juicebox-container"></div>
<!--END JUICEBOX EMBED-->

What is the easiest way to make part of the config.xml (here elaimet.xml) same for every gallery?

So elaimet.xml would look like just this:

<juiceboxgallery 

    useFlickr="true"
    flickrShowTitle="false"
    flickrShowDescription="true"
    flickrImageSize="ORIGINAL"
    flickrImageCount="200"
    flickrUserId=""
    flickrSetId="721576XXXXXXXX"
    flickrSort="date-taken-desc"
    
/>

There would be one file (asetukset.xml) that loads following settings to each gallery's own config.xml-file. Is there some way to include xml-file in another xml-file?  I found some information from the internet but I couldn't get it to work with Juicebox:
http://stackoverflow.com/questions/5121 … r-xml-file

    backgroundColor="rgba(248,248,248,1)"
    buttonBarBackColor="rgba(0,0,0,.4)"
    buttonBarIconHoverColor="rgba(255,0,0,1)"
    buttonBarPosition="TOP"
    captionBackColor="rgba(248,248,248,.8)"
    captionHAlign="LEFT"
    captionPosition="BELOW_IMAGE"
    displayTime="4"
    enableAutoPlay="true"
    enableDirectLinks="true"
    frameWidth="1"
    galleryFontFace="Arial,Helvetica,sans-serif;"
    galleryHeight="450"
    galleryTitle=""
    galleryTitlePosition="NONE"
    galleryWidth="500"
    imageFrameColor="rgba(0,0,0,.4)"
    imageNavPadding="30"
    imageNavPosition="IMAGE"
    imageShadowBlur="0"
    imageShadowColor="rgba(0,0,0,0)"
    imageTransitionTime="0.2"
    imageTransitionType="CROSS_FADE"
    importCaption="IPTC"
    importTitle="IPTC"
    languageList="Näytä pistenavigointi|Piilota pistenavigointi|Suurenna kokoruutuutilaan|Sulje kokoruututila|Avaa kuva uudessa ikkunassa|Kuvat|Seuraava kuva|Edellinen kuva|Soita musiikki|Pysäytä musiikki|Näytä tiedot|Piilota tiedot|Aloita näytös|Pysäytä näytös|Näytös päällä|Näytös suljettu|Mene takaisin|Osta tämä kuva|Jaa: Facebook|Jaa: Twitter|Jaa: Google+|Jaa: Pinterest|Jaa: Tumblr|/"
    maxCaptionHeight="30"
    navButtonBackColor="rgba(0,0,0,0.4)"
    navButtonIconHoverColor="rgba(255,0,0,1)"
    showAutoPlayButton="true"
    showImageNav="false"
    showImageOverlay="ALWAYS"
    showNavButtons="true"
    showOpenButton="false"
    showPagingText="False"
    showSmallThumbsOnLoad="true"
    showThumbsButton="false"
    showThumbsOnLoad="true"
    splashButtonText="Avaa galleria"
    textColor="rgba(0,0,0,1)"
    textShadowColor="rgba(0,0,0,0)"
    thumbFrameColor="rgba(255,0,0,0.8)"
    thumbHeight="60"
    thumbHoverFrameWidth="1"
    thumbSelectedFrameWidth="2"
    thumbShadowColor="rgba(0,0,0,0)"
    thumbsVAlign="BOTTOM"
    thumbWidth="60"
    topAreaHeight="0"
    topBackColor="rgba(255,255,255,0)"
    useFullscreenExpand="true"

Thank you. This clarified the thing to me.

One problem however.

When I have imageTransitionType="NONE" and captionPosition="BELOW_IMAGE" I have problem with IE10.

The captions changes perfectly with Firefox and Chrome. With IE10 after image change the caption disappears and doesn't come back expect when the thumbnail group changes also. But after when the first image changes the captions disappear again.

--

--

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

I tried gallery with default settings straight from the Builder-pro and same problem with IE10.

--

If I put the imageTransitionType="CROSS_FADE" to imageTransitionType="NONE" I will get the result I want with the caption...

Sample here:
--

However, In this way I lose the fading from the image... Other options? :)

Hi!

I have my site's test gallery here:
--

I have problem with caption overlay flashing everytime when I change picture.

I have been trying to make the Juicebox pro gallery to fit my new "minimalistic" site design.

I think I have got it now. Only problem is that flickering/flashing when you change image.

Normally it would be okay if the caption would be overlay the image but now the caption is under the image and the flashing looks little bit nasty to my eye.

Anything I could do?

8

(496 replies, posted in Juicebox-Pro Support)

- Multi-language (user configurable at least)
- Smoother fade transition