In the next version of Juicebox, thumbnails within a gallery will still all be the same size as each other (they do not need to be square) but the images used to fill the thumbnail dimensions will be scaled-to-fill. This is certainly an improvement over the current behavior (which center-crops images) and allows for images which are nowhere near the thumbWidth and thumbHeight dimensions to be used as thumbnails, although it is not what you are looking for.

Please feel free to post suggestions for future versions in the Feature Requests thread. This keeps all the ideas together and ensures that they are not overlooked by the developers.
Thank you.

On further investigation, the problem may be related to server-side caching.
If caching is disabled on your web server, then Juicebox will have to download the images every time it needs them (as it will not be able to request them from a cache) and this may be causing the problem.

If you have an Apache web server and have a .htaccess file with an entry such as the following (to disable caching), then please try removing it to see if it helps.

Header set Cache-Control "max-age=0, private, no-cache, no-store, must-revalidate"

This may solve the problem.

The reason for the gallery not displaying currently is as follows.
The embedding code on your https://www.countyfairgrounds.net/findanevent/findanevent.php web page uses the following code:

<script src="jbcore/juicebox.js"></script>

Therefore, the 'juicebox.js' file should be located at https://www.countyfairgrounds.net/findanevent/jbcore/juicebox.js but going directly to that location in a browser results in an error 404 (file not found).
The 'juicebox.js' file is not where it should be on your web server (according to your embedding code).

As you have uploaded a complete gallery folder to https://www.countyfairgrounds.net/findanevent/currentgalleries/, you can point towards this gallery folder using a baseUrl.
Change your embedding code (on your findanevent.php page) to the following and your gallery should display.

<!--START JUICEBOX EMBED-->
<script src="currentgalleries/jbcore/juicebox.js"></script>
<script>
    new juicebox({
        baseUrl: "currentgalleries/",
        containerId: "juicebox-container",
        galleryWidth: "300px",
        galleryHeight: "550px",
        backgroundColor: "rgba(128,0,0,1)"
    });
</script>
<div id="juicebox-container">
    *** KEEP YOUR GALLERY'S SEO CONTENT CODE HERE ***
</div>
<!--END JUICEBOX EMBED-->

Alternatively, you could keep your gallery's embedding code exactly as it is and copy the contents of the currentgalleries directory into the findanevent directory.
Either solution should work fine.

I would recommend keeping your gallery in the currentgalleries folder and using the baseUrl code (as above).
Keeping the gallery files together in a separate folder should help to keep things organized on your web server.

A couple of other notes:

There is absolutely nothing wrong with naming your gallery folder currentgalleries. This is just as valid as calling it anything else and it will not affect the functionality of your web site. In fact, you have named your gallery folder well, sticking to web-safe alphanumeric characters. (Using other 'reserved' characters in a web server directory name can sometimes cause problems.)

The fact that your web site is https:// should not make a difference to the embedding or functionality of a Juicebox gallery.

I hope the information above helps.

I have viewed your gallery in Firefox 34.0, Chrome 39.0, Opera 26.0, IE11 and Safari 5.1.7 on my PC (and have clicked the 'Info' and 'Welkom' links several times in each browser) and do not see the problem you are reporting.
Try clearing your browser's cache to ensure that your browser is fetching and using the most recent versions of your files from your web server.
Also, I notice that your gallery's dimensions are 100% x 100% and that your gallery's parent container's dimensions are fixed pixel values. This should be fine but try changing your gallery's dimensions to match those of its parent container to see if this makes a difference.

The imageTransitionType configuration option works only in Mouse Input Mode (as noted on the Config Options page). In Touch Input Mode, imageTransitionType uses the default value of SLIDE which best matches the swipe gesture used to navigate between images. This cannot be changed.

Even if the problem is only with a certain browser, we would still very much like to track the problem down.

If you have the time, I would be grateful if you could please confirm whether or not you see the problem in my test gallery (which is a gallery straight out of JuiceboxBuilder-Pro but using the same configuration options that your own test gallery uses).

The fact that you do not see the problem in any of our demo galleries suggests that the problem is either with a certain combination of configuration options or with custom code on your own web page. If you do see the problem in my test gallery, then the configuration options used in the gallery may be the cause (and I can then log a bug with the developers if necessary).

Thank you.

Thank you for sharing your findings.
I will pass this information on to the developers.

@pjl

As noted above, the bug has been fixed for the next version of Juicebox.
There is no set release date for the next version and I really do not know when it will be released. It may be days or weeks. Any estimate I give you could turn out to be wholly inaccurate.
However, we are working hard to get the next version ready.
All I can suggest is that you join the mailing list at the foot of our homepage, follow us on Twitter @JuiceboxGallery or subscribe to our blog RSS feed to be notified of new releases.
Thank you for your patience.

Juicebox generates valid HTML 5 code so if you are getting errors on your web page relating to Juicebox code, please try using the HTML 5 Doctype Declaration on your web page (and ensure that the other code on your web page is HTML 5 compliant).

<!DOCTYPE HTML>

I do not see the problem in any browsers on my PC.
Please take a look to see if the problem occurs in this test gallery. It uses the same configuration options that your own test gallery uses but the web page itself uses the HTML 5 DTD and is created by JuiceboxBuilder-Pro with no custom code on it.
If you still see the problem in this gallery, then it may be due to an incompatibility between certain configuration options and Safari 8 (perhaps imageTransitionType="CROSS_FADE" or imageTransitionTime="1.5"). Try using the default values of imageTransitionType="SLIDE" and imageTransitionTime="0.5" to see if this makes a difference.
Please let me know how you get on so that I can log a bug report with the developers if necessary. Thank you.

@gfs

Do you see the problem with any of our demo galleries on this web page?
If so, then please let me know.
If not, then it is possible that your problem is unique to your own web page (and the code within it).

Juicebox generates valid HTML 5 code and your embedding code looks OK. The problem you are seeing probably originates from putting your embedding code inside <p> and <span> tags, some of which also seem to have no closing </p> tag. (Inline elements such as <p> and <span> tags not contain block elements such as <div> tags.)

I would start by fixing the errors on your web page. Once the code on your web page validates correctly, your web page should be rendered with greater predictability and consistency across different browsers.
Even if this does not solve your problem, we can at least then eliminate HTML errors from being the cause of your problem.

Most of the errors on your web page seem to be due to stray end tags and unclosed elements.
Unfortunately, not being familiar with your web page's layout and with your web page's code not being indented, it is hard (at a glance) to see where containers should be opened and closed.

Try not to be overwhelmed by the errors on your web page. (There are not actually that many but most of them seem to be related to the layout rather than syntax errors or typos.) Just go through them one by one. Each one you fix is a step closer to a valid web page. If you see an error such as "Stray end tag.", then it is possible that there may be no corresponding opening tag and the stray end tag can just be removed. If you see an error such as " Unclosed element.", then try to figure out what it is you want within the tag and that should lead you to where the closing tag should be.

I hope this helps.

That is correct. imageScaleMode is a Pro configuration option. I should have made that clear in my post above. Sorry for any confusion.
For reference, all Lite configuration options can be found here. (All configuration options on the Config Options page are supported by Juicebox-Pro.)

It looks like your gallery's embedding code should be within your <div id="content" class="vier"> ... </div> container. If you move the entire embedding code to within this container, then the gallery should be positioned to the right of your side menu. However, you may need to change the dimensions and/or the position of your <div id="content" class="vier"> ... </div> container in your 'ruthhahn.css' file. At the moment, the div may be too low down on your web page and have a limited width. Check (and change, if necessary) the following code in your 'ruthhahn.css' file.

div#content {
    position: absolute;
    top: 156px;
    left: 270px;
    height: 400px;
}

div#content.vier {
    width: 528px;
}

There is also an example of using a side menu in the Using a Resizable Gallery with a Header support section. You could perhaps copy the sample web page's code (view the source of the page in your browser) and swap the content of the side menu for your own navigation menu.

It you really want to exactly replicate the layout of the Juicebox Lite Embedded Example, you can copy the HTML code of the page (view the source of the page in your browser) and swap the sample gallery's embedding code for that of your own gallery.

The Juicebox Lite Embedded Example uses all default settings (except for changing the gallery's dimensions, background color and setting a Gallery Title and Splash Page Description).

If you let me know exactly what you are looking to achieve (and what you currently have), then perhaps I can help further.
Please post a URL to your gallery's web page so that I can see what your gallery currently looks like. Thank you.