1 Topic by hirte_7 (edited by hirte_7 2013-01-11 16:41:36)

  • From: Switzerland
  • Registered: 2013-01-10
  • Posts: 6

Topic: How to create a gallery with fixed size?

Hi there,

I just get started with Juicebox. I created several galleries and that is all working fine. Now I do understand that galleries behave differently depending on the space available in a browser window or device. But how do I limit the max space a gallery uses on my web page? Lets say I do not want it be bigger then 920 to 920 pixels. I am not sure if there are settings for this or if that would be some additional HTML code? I am embedding the galleries in Adobe Muse (just in case that matters).

Thank you!

hirte_7's Website

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

Re: How to create a gallery with fixed size?

You can set a gallery's dimensions to absolute pixel values (rather than percentages) with embedding code such as:

<!--START JUICEBOX EMBED-->
<script src="jbcore/juicebox.js"></script>
<script>
new juicebox({
containerId : "juicebox-container",
galleryWidth: "920",
galleryHeight: "920",
backgroundColor: "#222222"
});
</script>
<div id="juicebox-container"></div>
<!--END JUICEBOX EMBED-->

When doing so, your gallery will always be a fixed size, regardless of the size of the user's browser window.
If creating or editing your gallery with JuiceboxBuilder-Pro, you can set the gallery's dimensions in the 'Customize -> Lite' section.

I am embedding the galleries in Adobe Muse (just in case that matters).

When embedding your gallery with Adobe Muse (following the instructions here), you must set your gallery's height (to an absolute pixel value) in the gallery's own embedding code.
You can leave the gallery's width at 100% and then constrain the gallery to a fixed width using the width of the HTML frame in Adobe Muse.

  • From: Switzerland
  • Registered: 2013-01-10
  • Posts: 6

Re: How to create a gallery with fixed size?

Thank you Steven!

hirte_7's Website