Transparent Background with Showkase iframe embed

First of all, you will need to set the gallery's 'Gallery background color opacity' to 0 (to set the background to be fully transparent) in the Juicebox page's 'Gallery Lite Options' section.

Then, for Internet Explorer, you may also need to use the allowtransparency="true" attribute in your iframe as follows:

<iframe src="/showkase/gallery/index.html" width="800" height="600" allowtransparency="true" frameborder="0" scrolling="no"></iframe>

No, setting a gallery's background to be transparent is the same for both Juicebox-Lite and Juicebox-Pro.
Please post the URL to the web page containing your iframe so that I can take a look and investigate further. Thank you.

Thank you for providing the URL to your web page. I now see the problem.
Your gallery does have a transparent background but the background color of the page that the gallery is embedded into (the Showkase page that you load into your iframe) has a background color of #222222.
You will need to make the background of the Showkase gallery page transparent, too.

Open the '_themes/manager/css/custom.css' file in a plain text editor and add the following code:

body, html {
    background-color: transparent !important;
}

Alternatively, instead of using an iframe, you could embed the gallery directly into your web page using the baseUrl method as documented here (and set the gallery's background to be transparent in the embedding code).

Just replace your iframe code with the following:

<!--START JUICEBOX EMBED-->
<script src="/showkase/gallery/jbcore/juicebox.js"></script>
<script>
  new juicebox({
    baseUrl : '/showkase/gallery/',
    containerId : 'juicebox-container',
    galleryWidth : '100%',
    galleryHeight : '800',
    backgroundColor: 'rgba(0,0,0,0)'
  });
  </script>
<div id="juicebox-container"></div>
<!--END JUICEBOX EMBED-->

This has none of the drawbacks that using an iframe has (please see here for details) and avoids the need to add any custom CSS to your Showkase pages.

That's great! Thank you for letting me know.

Sorry, my mistake. The baseUrl method should work fine. Juicebox galleries within Showkase share a common 'jbcore' folder so the path to your 'jbcore' folder was incorrect in my code above.
Please try the following code:

<!--START JUICEBOX EMBED-->
<script src="/showkase/_viewers/juicebox/jbcore/juicebox.js"></script>
<script>
  new juicebox({
    baseUrl : '/showkase/gallery/',
    containerId : 'juicebox-container',
    galleryWidth : '100%',
    galleryHeight : '800',
    backgroundColor: 'rgba(0,0,0,0)'
  });
  </script>
<div id="juicebox-container"></div>
<!--END JUICEBOX EMBED-->

The first one I tried worked but i've now swapped to the address you suggested which also works. The only problem is that the social and navigation icons are not displaying now.