Hello!
I have a website here that I built using Juicebox Pro galleries a few years ago, and the old galleries still work fine, but when I downloaded the new Juicebox Pro software and attempted to repeat the same process to add a new gallery, it simply does not display, even though it seems like everything is right.

It might be related to the fact that I have an animated collapse javascript running to show and hide the different galleries, but it shouldn't matter that much, since the javascript applies itself to a container around each gallery, instead of to the gallery itself.

I can view the new juicebox's index.html page and it renders there, I just can't get it to appear on the website.

http://kimkrauseartist.com/index_old.html <- website in progress, with attempt to add new gallery (top is newest). You can see how the other galleries display.

Below is the code for my new embed (juicebox4) next to an older embed (juicebox3). I tried leaving in the recent code additions for non-javascript-enabled devices but it didn't seem to make a difference.

Any help is greatly appreciated.

PARTIALLY RESOLVED: It has something to do with the way Juicebox (or the client server?) is fetching the javascript, and the GoDaddy servers are just eating themselves when I try to use FTP for some reason.

I had to do a bunch of fiddling with the way it loads the javascript, and ultimately had to tell it to load the pre-1.5 Juicebox javascript, because there's some code in there that I can't access (namely, a gradation in the caption that doesn't have an option in Juicebox Pro, as well as button placements, etc that didn't match the older galleries I'm using.) The working code is what's live now. If you can explain how it's working and the below wasn't, feel free to do so. :/

In addition, I had to manually set "OVERLAY_IMAGE" for the caption in the config xml file because it just wasn't applying through the app for some reason.

Below is my original code:

<a href="#" rel="toggle[gallery4]" /><h1>The Nature of Things (N.O.T.) &raquo;</h1></a>
<div id="gallery4" >
<!--START JUICEBOX EMBED-->
<script src="juicebox4/jbcore/juicebox.js"></script>
<script>
new juicebox({
containerId : "juicebox-container4",
baseUrl : 'juicebox4/',
galleryWidth: "600px",
galleryHeight: "600px",
backgroundColor: "rgba(255,255,255,1)"
});
</script>
<div id="juicebox-container4"></div>
</div>
<!--END JUICEBOX EMBED-->

<a href="#" rel="toggle[gallery3]" /><h1>Eleusinian Mysteries &raquo;</h1></a>
<div id="gallery3" >
<!--START JUICEBOX EMBED-->
<script src="juicebox3/jbcore/juicebox.js"></script>
<script>
new juicebox({
containerId : "juicebox-container3",
baseUrl : 'juicebox3/',
galleryWidth: "600px",
galleryHeight: "600px",
backgroundColor: "rgba(255,255,255,1)"
});
</script>
<div id="juicebox-container3"></div>
<!--END JUICEBOX EMBED-->
</div>