1. Remove the thumbnail bar entirely
This can be achieved only in Juicebox-Pro (not in Juicebox-Lite, the free version) by setting showThumbsOnLoad="FALSE" (to hide the thumbnails when the gallery is initialy displayed) and showThumbsButton="FALSE" (to hide the Thumbnail Button on the Button Bar to prevent users from being able to toggle the thumbnails on and off).
2. Remove all the shadow edges and hover shadows to my .png images
Set imageShadowBlur="0" or imageShadowColor="rgba(0,0,0,0)" to make the shadow fully transparent (Juicebox-Pro only).
3. Set my main index page image to 270x400 pixels
You can set the dimensions for the gallery via the galleryWidth and galleryHeight entries in the embedding code.
Your embedding code currently omits both galleryWidth and galleryHeight so Juicebox will use the default value of '100%' for both (resulting in the gallery filling both the width and height of its parent container).
If you want your gallery to be 270px x 400px, then use embedding code such as:
<!--START JUICEBOX EMBED-->
<script src="jbcore/juicebox.js"></script>
<script>
new juicebox({
containerId: "juicebox-container",
galleryWidth: "270",
galleryHeight: "400"
});
</script>
<div id="juicebox-container"></div>
<!--END JUICEBOX EMBED-->No matter what the dimensions of the gallery are, the main images within the gallery will be scaled according to the value of the imageScaleMode configuration option which can be set to SCALE_DOWN, SCALE, FILL, STRETCH or NONE (Juicebox-Pro only). Short descriptions of each of these values can be found in the imageScaleMode entry in the Main Image Options section of the Config Options support page.
4. Figure out why my fullscreen images aren't working in Firefox
When the Expand Button is clicked, the gallery is expanded on top of the embedding page. However, the web page that your gallery is in has HTML errors and this is likely to be causing problems when the gallery is expanded.
Most importantly, your web page does not contain a Doctype Declaration (at the very top of the HTML document before the opening <html> tag). It is important for every web page to contain a Doctype Declaration to let the browser know what set of standards the code on the web page should conform to. Please see here for details.
It looks like the HTML 5 Doctype Declaration would best suit the code on your web page so start by placing the following code at the very top of your web page (before all other content).
<!DOCTYPE HTML>Now, with the Doctype Declaration in place, check your web page for HTML errors with the W3C Markup Validation Service and fix any errors reported.
Once the code on your web page validates correctly, your web page should be rendered with greater predictability and consistency across different browsers (and it should hopefully solve your fullscreen problem).
The errors on your web page should ideally be fixed but Juicebox-Pro provides an alternative solution to your fullscreen problem. By setting expandInNewPage="TRUE", you can force the gallery to be expanded on a new page of its own (instead of on top of the embedding page) where the code (and errors) on the embedding page cannot interfere with the gallery.
For reference, short descriptions for all the configuration options in bold above can be found on the Config Options support page.
Many of the features required to customize your gallery as you would like it are Juicebox-Pro only.
Unfortunately, we do not offer a trial version of Juicebox-Pro but we do offer a 100% money-back guarantee.
Please see this FAQ for details:
Can I try a trial version of Juicebox-Pro?
I hope this helps to clarify things.
If you have any further queries, please let me know.
