• Registered: 2014-04-21
  • Posts: 28

Topic: Embedding a JB gallery

I want to embed a gallery in a web page. In a table between <TD> tags - in other words, in a table cell. But when loaded the gallery fills the entire screen. Can I do this? Thanks

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

Re: Embedding a JB gallery

Yes, you should be able to embed a Juicebox gallery into a <td> table cell.
The easiest way to do this would be to assign fixed pixel dimensions to your galleryWidth and galleryHeight, e.g.:

<table>
    <tr>
        <td>
            <script src="jbcore/juicebox.js"></script>
            <script>
            new juicebox({
                containerId: 'juicebox-container',
                galleryWidth: '600',
                galleryHeight: '400',
                backgroundColor: 'rgba(34,34,34,1)'
            });
            </script>
            <div id="juicebox-container"></div>
        </td>
    </tr>
</table>

If you use a percentage for your galleryHeight (for example) such as 100%, then you might need to make sure that all parent containers of the gallery (e.g. <tr> and <table> up to and including the <body> tag) have a height specified via CSS, otherwise Juicebox and the browser might not know what the gallery's actual height should be 100% of.

  • Registered: 2014-04-21
  • Posts: 28

Re: Embedding a JB gallery

Thank you, this worked beautifully.

Another question: can I get rid of the buttons that appear in the top right corner of images?

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

Re: Embedding a JB gallery

I think you're probably referring to the gallery's Button Bar.
Try setting buttonBarPosition="NONE" (in JuiceboxBuilder-Pro's 'Customize -> Button Bar' section).

  • Registered: 2014-04-21
  • Posts: 28

Re: Embedding a JB gallery

Steven @ Juicebox wrote:

I think you're probably referring to the gallery's Button Bar.
Try setting buttonBarPosition="NONE" (in JuiceboxBuilder-Pro's 'Customize -> Button Bar' section).

Worked fine! One last thing - I would like to get right of the left and right arrows that display on mouse-over.

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

Re: Embedding a JB gallery

Set showImageNav="NEVER" ('Customize - Main Image').