4,026 Reply by Steven @ Juicebox

(7 replies, posted in Juicebox-Pro Support)

My suggestion is possibly the easiest solution to your problem and it would be worth persevering to get it to work within your web page.
It relies on listening for a change in the browser window size and then assigning new width and height dimensions to the gallery, based on the current width of the browser window.

You want your gallery's width to always fill the width of its parent container so you can set the gallery's width to 100% in the embedding code (and you do not need to worry about the gallery's width in the dynamic resizing code).

You need to be able to change the gallery's height when the user changes the browser window's width so do the following:
(1) Give the table into which you embed your gallery an id="wrap" (so that you can change its dimensions using JavaScript).
(2) Your images have an aspect ratio of approximately 2.6:1 (and there are no other elements within your gallery) so use this factor when working out the gallery's height in relation to its width.

Try using the following as your 'index.html' page:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"><!-- InstanceBegin template="/Templates/page.dwt" codeOutsideHTMLIsLocked="false" -->
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<!-- InstanceBeginEditable name="doctitle" -->
<title>Home - Regional Development Australia Great Southern</title>
<!-- InstanceEndEditable -->
<style type="text/css">
<!--
body {
    background-color: #fafafc;
    background-image: url(image/bg.png);
    background-repeat: repeat-x;
    margin-left: 0px;
    margin-top: 0px;
    margin-right: 0px;
    margin-bottom: 0px;
}
-->
</style>
<link href="CSS/Level2_Verdana_Text.css" rel="stylesheet" type="text/css" />
<script type="text/JavaScript">
<!--
function MM_preloadImages() { //v3.0
  var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array();
    var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++)
    if (a[i].indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}}
}

function MM_swapImgRestore() { //v3.0
  var i,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a[i])&&x.oSrc;i++) x.src=x.oSrc;
}

function MM_findObj(n, d) { //v4.01
  var p,i,x;  if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) {
    d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}
  if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n];
  for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document);
  if(!x && d.getElementById) x=d.getElementById(n); return x;
}

function MM_swapImage() { //v3.0
  var i,j=0,x,a=MM_swapImage.arguments; document.MM_sr=new Array; for(i=0;i<(a.length-2);i+=3)
   if ((x=MM_findObj(a[i]))!=null){document.MM_sr[j++]=x; if(!x.oSrc) x.oSrc=x.src; x.src=a[i+2];}
}
//-->
</script>
<!-- InstanceBeginEditable name="head" --><!-- InstanceEndEditable -->
<style type="text/css">
<!--
a:link {
    color: #327027;
    font-weight: 400;
    text-decoration: none;
}
a:visited {
    text-decoration: none;
    color: #B1C444;
}
a:hover {
    text-decoration: underline;
}
a:active {
    text-decoration: none;
}
-->
</style>
<script type="text/javascript" src="jbcore/juicebox.js"></script>
<script type="text/javascript">
    function doLayout() {
        var galleryWidth = $('#wrap').width();
        var galleryHeight = parseInt(galleryWidth / 2.6);
        $('#wrap').height(galleryHeight);
    }
    $(document).ready(function() {
        doLayout();
        $(window).on('resize', doLayout);
        new juicebox({
            containerId: 'juicebox-container',
            galleryWidth: '100%',
            backgroundColor: 'rgba(255,255,255,1)'
        });
    });       
</script>
</head>

<body onload="MM_preloadImages('image/menu/home-over.jpg','image/menu/reports-over.jpg','image/menu/current-over.jpg','image/menu/pub-over.jpg','image/menu/contact-over.jpg','image/menu/news-over.jpg','image/menu/region-over.jpg','image/menu/grants-over.jpg','image/menu/about-rda-over.jpg','image/menu/r-plan-over.jpg')">
<table width="82%" border="0" align="center" cellpadding="0" cellspacing="0">
  <tr>
    <td><table width="100%" border="0" align="center" cellpadding="0" cellspacing="0" class="box1">
      <tr>
        <td height="42" align="center" valign="top" bgcolor="#FFFFFF"><table width="100%%" border="0" cellspacing="0" cellpadding="0">
            <tr>
              <td><!-- InstanceBeginEditable name="EditRegion5" -->
                <table id="wrap" width="100%" border="0" cellspacing="0" cellpadding="0">
                  <tr>
                    <td>
                        <!--START JUICEBOX EMBED-->
                        <div id="juicebox-container"></div>
                        <!--END JUICEBOX EMBED-->
                    </td>
                  </tr>
                </table>
              <!-- InstanceEndEditable --></td>
            </tr>
            <tr>
              <td height="36" background="image/menu/menu-bg.jpg"><table width="100%%" height="34" border="0" cellpadding="0" cellspacing="0">
                <tr>
                  <td width="14%" align="center" valign="middle" background="image/menu/menu-bg.jpg"><a href="index.html"><img src="image/menu/home.jpg" alt="Home" name="home" width="135" height="34" border="0" id="home" onmouseover="MM_swapImage('home','','image/menu/home-over.jpg',1)" onmouseout="MM_swapImgRestore()" /></a> </td>
                  <td width="14%" align="center" valign="middle" background="image/menu/menu-bg.jpg"> <a href="reports_research.html"><img src="image/menu/reports.jpg" alt="Reports &amp; Research" name="rep" width="283" height="34" border="0" id="rep" onmouseover="MM_swapImage('rep','','image/menu/reports-over.jpg',1)" onmouseout="MM_swapImgRestore()" /></a> </td>
                  <td width="14%" align="center" valign="middle" background="image/menu/menu-bg.jpg"> <a href="current_projects.html"><img src="image/menu/current.jpg" alt="Current Projects" name="current" width="256" height="34" border="0" id="current" onmouseover="MM_swapImage('current','','image/menu/current-over.jpg',1)" onmouseout="MM_swapImgRestore()" /></a> </td>
                  <td width="14%" align="center" valign="middle" background="image/menu/menu-bg.jpg"> <a href="publications.html"><img src="image/menu/pub.jpg" alt="Publications" name="pub" width="213" height="34" border="0" id="pub" onmouseover="MM_swapImage('pub','','image/menu/pub-over.jpg',1)" onmouseout="MM_swapImgRestore()" /></a> </td>
                  <td width="14%" align="center" valign="middle" background="image/menu/menu-bg.jpg"><a href="contact.html"><img src="image/menu/contact.jpg" alt="Contact" name="con" width="159" height="34" border="0" id="con" onmouseover="MM_swapImage('con','','image/menu/contact-over.jpg',1)" onmouseout="MM_swapImgRestore()" /></a></td>
                  </tr>
              </table></td>
            </tr>
            <tr>
              <td><table width="95%" border="0" align="center" cellpadding="0" cellspacing="7">
                <tr>
                  <td align="left" valign="top"><!-- InstanceBeginEditable name="EditRegion4" --><span class="big">Regional Development Australia Great Southern WA Inc</span><!-- InstanceEndEditable --><br />
                    <!-- InstanceBeginEditable name="EditRegion3" -->
                    <p class="bodystyle">Regional Development Australia (RDA) is an initiative of the Australian Government that aims to enhance the growth and development of regional areas by bringing together and working with the three levels of government to provide a strategic and targeted response to issues in regional areas. The Network is led by the Hon Warren Truss MP as the Minister for Infrastructure and Regional Development.</p>
                    <table width="100%%" border="0" cellspacing="9" cellpadding="0">
                      <tr>
                        <td width="25%" align="center" valign="middle"><a href="news.html"><img src="image/menu/news.jpg" alt="News" name="n" width="265" height="269" border="0" id="n" onmouseover="MM_swapImage('n','','image/menu/news-over.jpg',1)" onmouseout="MM_swapImgRestore()" /></a></td>
                        <td width="25%" align="center" valign="middle"><a href="our_region.html"><img src="image/menu/region.jpg" alt="Our Region" name="r" width="260" height="269" border="0" id="r" onmouseover="MM_swapImage('r','','image/menu/region-over.jpg',1)" onmouseout="MM_swapImgRestore()" /></a></td>
                        <td width="25%" align="center" valign="middle"><a href="grants_funding.html"><img src="image/menu/grants.jpg" alt="Grants &amp; Funding" name="g" width="263" height="269" border="0" id="g" onmouseover="MM_swapImage('g','','image/menu/grants-over.jpg',1)" onmouseout="MM_swapImgRestore()" /></a></td>
                        <td width="15%" rowspan="2"><iframe class="tkf-em-cal" scrolling="no" width="300" height="518px" frameborder="0" style="border-width:0;background-color:transparent" src="https://tockify.com/em/rdags"><a href="https://tockify.com/rdags">RDA Great Southern Events Calendar</a></iframe></td>
                      </tr>
                      <tr align="center" valign="middle">
                        <td width="25%"><a href="about-rdags.html"><img src="image/menu/about-rda.jpg" alt="About RDA Great Southern" name="a" width="264" height="266" border="0" id="a" onmouseover="MM_swapImage('a','','image/menu/about-rda-over.jpg',1)" onmouseout="MM_swapImgRestore()" /></a></td>
                        <td width="25%"><a href="regional_plan.html"><img src="image/menu/r-plan.jpg" alt="Regional Plan 2013-2018" name="rp" width="260" height="266" border="0" id="rp" onmouseover="MM_swapImage('rp','','image/menu/r-plan-over.jpg',1)" onmouseout="MM_swapImgRestore()" /></a></td>
                        <td width="25%"><img src="image/menu/growing.jpg" alt="RDA Great Southern" name="rdags" width="263" height="266" id="rdags" /></td>
                      </tr>
                    </table>
                    <p class="bodystyle">&nbsp;</p>
                    <p>&nbsp;</p>
                  <!-- InstanceEndEditable --></td>
                </tr>
              </table></td>
            </tr>
          </table>
          </td>
      </tr>
      
    </table>
      <table width="100%" border="0" align="center" cellpadding="0" cellspacing="0">
        
        <tr>
          <td height="84"><img src="image/bottom.png" width="100%" height="84" /></td>
        </tr>
      </table></td>
  </tr>
</table>
</body>
<!-- InstanceEnd --></html>

Please note that I have not checked your web page for any HTML errors. You can do this with the W3C Markup Validation Service. All I have done is copy and paste your code and add/modify what is required to get the Juicebox sizing working (by inserting the <script> section at the end of the <head> section and changing the contents of the <table> into which you embed your gallery and giving it an 'id').
I have tested it and it seems to work OK.

Go to forum: Juicebox-Pro Support

4,027 Reply by Steven @ Juicebox

(1 replies, posted in Juicebox-Lite Support)

Does it matter if they're in sets / photostreams?

This should not matter as long as you are not displaying an individual Flickr Set via the flickrSetId configuration option (which will display all images in the set regardless of tags).

Juicebox uses the Flickr API to fetch images from Flickr's servers.
It simply requests the images from Flickr and displays the images returned.
If you have tagged images that are not being displayed, then the problem is likely to be with Flickr.
If Juicebox requests all images tagged with the term 'latest' but Flickr does not return all the images you expect, then there is, unfortunately, little that Juicebox itself can do.

Try entering your Flickr settings into Flickr's own API Explorer to see how many (if any) images are returned. (You will need to use the Flickr User Id instead of the Flickr User Name for this.)

Also, please also see this Flickr FAQ for a few suggestions which may help:
Why aren't my photos appearing in searches or groups?

Other things to try:
(1) Try removing and then re-adding the tags to your images.
(2) Make sure that all your tagged images are public (and not private).

If you continue to experience difficulties, perhaps you could ask Flickr why some of your tagged images are not appearing in API search results.

Go to forum: Juicebox-Lite Support

4,028 Reply by Steven @ Juicebox

(3 replies, posted in Juicebox-Pro Support)

I do not know where you saved your preset files to on your hard drive but if they are in the application's installation folder, then they will likely be deleted when you uninstall JuiceboxBuilder-Pro so please back them up to a different location first.

I would recommend saving your preset files to a location separate to the application's installation folder so that they are not lost if/when you uninstall JuiceboxBuilder-Pro.

Go to forum: Juicebox-Pro Support

4,029 Reply by Steven @ Juicebox

(3 replies, posted in Juicebox-Pro Support)

In order to install a new version of JuiceboxBuilder-Pro, it is necessary to first uninstall any existing version from your computer.
Also, between uninstalling and reinstalling, manually delete the following folder (to ensure that no files are left behind from the previous installation) and empty your trash:

/Users/your_username/Library/Application Support/Adobe/AIR/ELS/JuiceboxBuilder-Pro

Hopefully this will help.
(I have JuiceboxBuilder-Pro v1.3.3 installed and running OK under Adobe AIR 4.0 on my PC.)

Go to forum: Juicebox-Pro Support

4,030 Reply by Steven @ Juicebox

(15 replies, posted in Juicebox-Pro Support)

Thank you for testing the link I posted.
I have notified the developers of this issue and they will investigate further.

Go to forum: Juicebox-Pro Support

4,031 Reply by Steven @ Juicebox

(7 replies, posted in Juicebox-Pro Support)

no matter what I do I can not loose the white space that appears below the gallery

Depending on the height of your browser window, your gallery may have a different aspect ratio to that of your images.
When the image is scaled to fit within the gallery's image area, there may be space surrounding the image and because your gallery uses imageVAlign="TOP" (vertically aligning the main images to the top of the image area), all the space is pushed to below the main images.

You could perhaps set imageVAlign="CENTER" to balance the space between the top and bottom of your main image.

However, the ideal solution that you seem to be looking for is for the gallery's aspect ratio to remain constant no matter what the size or shape of the user's browser window is.
This can be achieved by implementing a solution such as the following.
To see the example in action, create a test gallery with JuiceboxBuilder-Pro and replace the gallery's 'index.html' page with the code below.

<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="utf-8" />
        <meta name="apple-mobile-web-app-capable" content="yes" />
        <style type="text/css">
            body {
                margin: 0px;
            }
            body, html {
                height: 100%;
                width: 100%;
            }
        </style>
        <script type="text/javascript" src="jbcore/juicebox.js"></script>
        <script type="text/javascript">
            function doLayout() {
                var windowWidth = window.innerWidth ? window.innerWidth : $(window).width();
                var galleryWidth = parseInt(windowWidth * 0.8);
                var galleryHeight = parseInt(galleryWidth / 2);
                $('#wrap').width(galleryWidth);
                $('#wrap').height(galleryHeight);
            }
            $(document).ready(function () {
                doLayout();
                $(window).on('resize', doLayout);
                new juicebox({
                    containerId: 'juicebox-container'
                });
            });       
        </script>
        <title>Test</title>
    </head>
    <body>
        <div id="wrap">
            <div id="juicebox-container"></div>
        </div>
    </body>
</html>

The '0.8' value is just an arbitrary width for the gallery (80%) for this example. You can change this to whatever you like.
The aspect ratio in the above example is 2:1 (set by the '2' in the line var galleryHeight = parseInt(galleryWidth / 2);).
Again, you can change this to whatever you like.
Hopefully you will be able to implement this within your own web page.

Also I posted recently about the gallery swiping on an ipad, is there some tweeking to the code that would prevent the sliding kicking in as I just want it to fade not be user interactive?

No. In Touch Input Mode, Juicebox automatically (and always) uses a slide image transition. This cannot be changed. Please see my reply to your query in this forum thread.

Go to forum: Juicebox-Pro Support

4,032 Reply by Steven @ Juicebox

(5 replies, posted in Juicebox-Lite Support)

Would it be possible that some of the files aren't compatible with dropbox?

No. Juicebox galleries can successfully be hosted on Dropbox. (There are no incompatible files within a Juicebox gallery.)

I've linked my virb account with my dropbox account,

There is no need to do this.

and moved the file into dropbox/apps/virb ....

This is not part of the procedure.

If you are following the instructions here, have you downloaded and installed the Dropbox client program onto your computer?
If so, then when you double-click the 'Dropbox' icon on your desktop, do you see a folder named 'Public'?
If not, then please create a public folder by clicking here.
Then all you need to do is drag and drop your Juicebox gallery folder into this 'Public' folder.
To get the public link to the gallery for use in the iframe, you would navigate inside the 'Public' folder, then navigate inside the gallery folder, right-click the gallery's 'index.html' file and select 'Copy public link'.
The link should look something like this:
https://dl.dropboxusercontent.com/u/123456789/gallery/index.html

Go to forum: Juicebox-Lite Support

4,033 Reply by Steven @ Juicebox

(6 replies, posted in Juicebox-Pro Support)

You can upgrade the Juicebox plugin for Lightroom from Juicebox-Lite to Juicebox-Pro (to remove the branding and the 50-image limit and to allow Pro configuration options to be used) by following the 'Upgrading to Juicebox-Pro' instructions on the plugin's web page.

As far as I am aware, there are no plans to introduce individual fields for every Pro configuration option in the plugin's interface but you can enter Pro options into the 'Pro Options' text area. Each option should be entered one per line in the format optionName="OPTION_VALUE". Use Ctrl-Enter to add a new line.

Otherwise, you can edit a gallery created by the plugin with JuiceboxBuilder-Pro (which has all Pro configuration options available in its interface).

The only products which have full support for all Juicebox-Pro configuration options in their interfaces are:
(1) JuiceboxBuilder-Pro (which comes with Juicebox-Pro)
(2) Showkase
(3) svManager

(None of the Juicebox plugins for third-party programs have individual fields for every Pro configuration option.)

Go to forum: Juicebox-Pro Support

4,034 Reply by Steven @ Juicebox

(5 replies, posted in Juicebox-Lite Support)

I can only upload each file individually

This will not work. The structure of the gallery's 'jbcore' folder needs to be kept intact. It is not possible to simply upload all gallery files individually to a single 'assets' folder within your Virb account.

As Virb is not a regular web host providing web space that you can upload your gallery folder to via FTP, you will not be able to host a gallery on Virb. You will have to host your gallery elsewhere (such as Dropbox) and load the gallery into your Virb page using an iframe as documented in the Embedding in a Web Template Site instructions.
When it comes to inserting the iframe into your Virb page, please see this Virb help page.

I tried to upload the file into dropbox, but it won't let me.

If you follow the Embedding in a Web Template Site instructions, you should be able to host your gallery on Dropbox (and you can check that it has worked by simply opening the public link for the gallery's 'index.html' file in a browser to display the gallery).

If you get stuck, please let me know how far you get in the instructions and what seems to be the problem so that I can help further.

Go to forum: Juicebox-Lite Support

4,035 Reply by Steven @ Juicebox

(2 replies, posted in Juicebox-Pro Support)

You can set imageTransitionType="SLIDE" (in JuiceboxBuilder-Pro's 'Customize -> Main Image' section) but it is not possible to have previous and next images displayed to the left and right of the main image currently being displayed.

If you want to have partial previous and next images displayed alongside the current image, you might like to take a look at another one of our products, AutoViewer, although please note that AutoViewer is a Flash image viewer and will not display galleries on mobile devices.

Go to forum: Juicebox-Pro Support

4,036 Reply by Steven @ Juicebox

(1 replies, posted in Juicebox-Pro Support)

Yes.
Set imageClickMode="OPEN_URL" (in JuiceboxBuilder-Pro's 'Customize -> Main Image' section) and when a user clicks a main image, the corresponding linkURL (from the gallery's XML file) will be opened in the appropriate linkTarget tab or window.
linkURLs and linkTargets can be entered for each individual image on JuiceboxBuilder-Pro's 'Images' tab.

Go to forum: Juicebox-Pro Support

4,037 Reply by Steven @ Juicebox

(15 replies, posted in Juicebox-Pro Support)

Thank you for providing the URL to your gallery.
It's just a thought but try removing the & character from your gallery's URL to see if this makes a difference.
The & character is reserved (as a delimiter for a query string) and may be causing a problem in certain browsers when resolving the URL for your audio file.
It may be unlikely to help but no one else has reported the problem you are describing so it might be worth trying.

Also, does the same problem occur in this test gallery?
http://www.juicebox.net/demos/pro/full/ … nLoad=true

Go to forum: Juicebox-Pro Support

4,038 Reply by Steven @ Juicebox

(5 replies, posted in Juicebox-Pro Support)

You currently have your gallery embedded within two iframes (an iframe within another iframe).
The first <iframe> on your 'Food' page is as follows:

<iframe class="page_food_fAmI1LvscHaNb76gfLVOv" frameborder="0" src="/cgi-bin/snippet.cgi?todo=as_page;instance=4577826729;num=1;community_id=4011990497" scrolling="no" allowTransparency="true"></iframe>

The page loaded into this iframe loads your gallery into another iframe.
Also, the page containing the second iframe does not use a Doctype Declaration. (All web pages should use a Doctype Declaration to inform the user's browser what set of standards the code on the web page should conform to.)
Try taking an iframe out of the equation and replace the above code with the following:

<iframe src="https://dl.dropboxusercontent.com/u/37903739/juicebox_gallery_food/food-index.html" width="1050" height="600" frameborder="0" scrolling="no"></iframe>

I do not know how you are adding the iframe to your Moonfruit page but there should be no need to have a second iframe (especially on a page with no Doctype Declaration) so perhaps Moonfruit support could help you out with this.

The double iframe and lack of Doctype Declaration on the page containing the second iframe may be contributing to your problems.

Also, try temporarily setting captionPosition to something other than NONE in your gallery to see if this helps.
There is a known bug (which has been logged and should hopefully be fixed in a future version of Juicebox) whereby a gallery with captionPosition="NONE" loaded into an iframe flickers in WebKit browsers (Chrome, Safari, Opera). This bug may also manifest itself in Chrome and Mobile Safari on mobile devices.

Go to forum: Juicebox-Pro Support

4,039 Reply by Steven @ Juicebox

(1 replies, posted in Juicebox-Pro Support)

Your single-domain license allows you to upload Juicebox-Pro galleries to a single website domain but the domain is not fixed and you are free to move your galleries between domains at any time you like.
As long as your Juicebox-Pro galleries are publicly accessible on only one domain at any time, that is fine. (If moving galleries from domain to domain, just delete them from the old domain after the move.)

Also, the single-domain license applies to public-facing website domains.
Having your galleries on development or staging sites will not be a problem.

Go to forum: Juicebox-Pro Support

4,040 Reply by Steven @ Juicebox

(1 replies, posted in Juicebox-Lite Support)

It looks like you main images have not been uploaded to the correct location on your web server.
According to your gallery's XML file, the first main image in your gallery should be located here http://sme-planner.com/scan/gallery/ima … tslide.jpg
... but if I go directly to that location in a browser, I get an error 404 message (file not found).
If I go directly to the first thumbnail in your gallery, the thumbnail displays OK: http://sme-planner.com/scan/gallery/thu … tslide.jpg

Check that the main images are in your http://sme-planner.com/scan/gallery/images/ directory and that the permissions on the 'images' directory (and on the main image files themselves) are not too restrictive. Default permissions of 644 for folders and 755 for files should be fine.

(Your gallery's embedding code is fine.)

IMAGE SIZE QUESTION:
Also... note my image sizes are "max of 1024 x 427", AND  the originals ARE that size... so, they were all very horizontal... again, not sure if that makes a diff either.

It does not matter what size the images in your gallery are (as long as they do not have too large a filesize).
You can have images of different resolutions in a single gallery. The images will all be scaled dynamically when the gallery is displayed according to the value to the imageScaleMode configuration option.

Caption question... I forgot that I cannot do captions for the LITE version... is it too late to change the file names on the images themselves, to reflect better captions... OR, can I HIDE the file names altogether?

Juicebox-Lite does support image titles and captions. It is just not possible to reposition the captions (or use other Pro Caption Options) unless you have Juicebox-Pro.
You can edit your gallery in JuiceboxBuilder-Lite to remove or change your image titles and captions (or you can edit your gallery's XML file manually if you like).
In JuiceboxBuilder-Lite, you can enter individual titles and captions for each image on the 'Images' tab or you can change the titles and captions for all images globally using the 'Images -> Titles' and 'Images -> Captions' options from the drop-down menu at the top.

Go to forum: Juicebox-Lite Support

4,041 Reply by Steven @ Juicebox

(4 replies, posted in Juicebox-Pro Support)

In Touch Input Mode, Juicebox automatically uses a slide image transition as this best matches the slide gesture used on mobile devices to navigate between images in a gallery.
This cannot be overridden. It is possible to force Juicebox to use Large Screen Mode on all devices and in all browsers (by setting screenMode="LARGE") but it is not possible to force Juicebox to use Mouse Input Mode and the imageTransitionType configuration option requires both Large Screen Mode and Mouse Input Mode.
(This is documented in the description of the imageTransitionType configuration option in the Main Image Options section of the Config Options page.)

Only applies for Large Screen Mode and Mouse Input Mode.

Go to forum: Juicebox-Pro Support

4,042 Reply by Steven @ Juicebox

(1 replies, posted in Juicebox-Pro Support)

Please take a look at this Flickr FAQ:
Help! My images are all red x's (or broken icons, not loading, etc.)

It may not completely answer your query but it certainly seems to be relevant and may point you in the right direction.

Go to forum: Juicebox-Pro Support

4,043 Reply by Steven @ Juicebox

(3 replies, posted in Juicebox-Pro Support)

When I click button expand gallery to return, my url stays "dirty", with "#" on end

This is intentional. The '#' is left at the end of the URL to prevent the browser from reloading the web page when the gallery is closed.

and when I try expand other gallery don't work.

I have viewed your web page in Firefox 26.0, Chrome 32 and Internet Explorer 11 and I can successfully expand and close different galleries on your web page without having to reload the page.

If you still see the problem you are describing, then try clearing your browser's cache before reloading your web page to ensure that your browser is fetching and using the latest versions of all your gallery files from your web server.

There are, however, a couple of things I notice.
(1) On initially opening your web page, your gallery's Button Bar is displayed beyond the right-hand edge of small browser windows. It is necessary to un-zoom the browser window to see the entire gallery.
You should be able to fix this by setting your gallery widths to 100% (rather than 1067px) to that the galleries span the width of their parent containers (no matter what the widths of the parent containers are).

(2) The images used for the thumbnails are displayed at odd sizes.
It looks like this may be due to the following CSS on lines 113-120 of your 'responsive.css' file (specifically the max-width rule):

    #page img {
      width: auto\9;
      height: auto;
      max-width: 100%;
      vertical-align: middle;
      border: 0;
      -ms-interpolation-mode: bicubic;
    }

The gallery is nested within your #page container and the CSS rules applied to all img tags within the #page container will apply to all img tags within the gallery, too. The gallery has no option but to inherit such global CSS rules.
Try using further ids or classes in your web page to apply CSS rules to only those elements which require them.
Alternatively, try just removing the max-width: 100%; entry from the code above. It should fix your Juicebox thumbnail sizing issue and may not affect any other elements on your web page (although you will need to test this to be sure).

Go to forum: Juicebox-Pro Support

4,044 Reply by Steven @ Juicebox

(3 replies, posted in Juicebox-Pro Support)

I think the problem on your web page is caused by loading the 'juicebox.js' JavaScript file for each gallery (immediately before each gallery's embedding code).
The 'juicebox.js' JavaScript file should be loaded only once per web page (rather than once per gallery).
Try loading the file only once on your page and your galleries should expand as expected.

I have logged this as a bug and it should hopefully be fixed in the next version of Juicebox.
However, loading one instance of 'juicebox.js' per page should work fine.

Go to forum: Juicebox-Pro Support

4,045 Reply by Steven @ Juicebox

(4 replies, posted in Juicebox-Lite Support)

Sorry if this was an inappropriate forum or I should have been more proactive in my investigations.

No problem at all. I was just giving you another avenue to pursue if the information in my post did not help.

Creating the folder fixed the problem.

I'm glad your problem has been resolved. Thank you for posting back to let me know.

Go to forum: Juicebox-Lite Support

4,046 Reply by Steven @ Juicebox

(4 replies, posted in Juicebox-Lite Support)

BTW, I plan to upgrade to the full version if I can get this working, as I wanted individual URLs for the images and more than 50 images.  Is the former possible in the Drupal 7 version of Juicebox?

A Juicebox gallery is still a Juicebox gallery, no matter what type of page it is embedded into.
The only difference is that the method of creating the gallery may not give you access to each and every Pro configuration option (and some manual modification may be required depending on how you go about creating and configuring your gallery).
However, upgrading the Juicebox module for Drupal from Juicebox-Lite (which it comes bundled with) to Juicebox-Pro will instantly lift the 50-image per gallery limit with no further action required.
How the module sources images, however, will be written into the module's code and might not be so easily changed.
Please note that we did not write the Drupal module ourselves and support for the module would be better directed towards the Drupal forum where the author of the module should be able to help you further.

With regard to the thumbnails in your gallery not displaying, the thumbURL entries in your gallery's XML file (http://dev.hmssurprise.org/juicebox/xml … 2eb25dc36a) are defined as follows:
http://dev.hmssurprise.org/sites/defaul … k=8jI9t1Iu
http://dev.hmssurprise.org/sites/defaul … k=QpRz8ipD

If I visit either of these URLs directly in a browser, I see an 'Error generating image.' message (rather than the image itself).
Searching through the Drupal forum with the term 'Error generating image.', it looks like the problem might be related to the permissions on your 'thumbnail' folder (or subfolders) or on the image files themselves.
Please check that the permissions are not too restrictive (using an FTP program) which may result in the images not being able to be read.
Default permissions of 755 for folders and 644 for images should be fine.

Go to forum: Juicebox-Lite Support

4,047 Reply by Steven @ Juicebox

(15 replies, posted in Juicebox-Pro Support)

This is certainly the case on iOS devices (and is documented in the description for playAudioOnLoad on the Config Options page) but I do not know if this is also true for Android devices (and you should not need to click the Audio Button twice). It sounds like your gallery's Audio Button may initially be displaying the 'pause' symbol (implying that the audio is playing when it is not) but then you have to click the button (to display the 'play' symbol) and then click the button once again. Is this correct?

Please make sure that you are using the latest version of Juicebox-Pro (v1.3.3) to ensure that any bugs that were present in previous versions but which have since been fixed are not contributing to your problem.
Instructions for upgrading Juicebox-Pro can be found here.

If you continue to experience difficulties, please let me know what device/browser you see this problem in and please post the URL to your gallery so that we can investigate further. Thank you.

Go to forum: Juicebox-Pro Support

4,048 Reply by Steven @ Juicebox

(9 replies, posted in Juicebox-Lite Support)

I notice that your gallery has a fixed width of 700px (set in the embedding code in your https://dl.dropboxusercontent.com/u/129 … index.html page).
When loading a gallery into an iframe, I would recommend setting the gallery's dimensions to 100% x 100% so that it fills the iframe, no matter what the size of the iframe is.

Then, being that the gallery is 100% x 100%, the Splash Page will be disabled by default so if you want to continue to use a Splash Page, set showSplashPage="ALWAYS".
Please be aware that when clicking the Splash Page, the gallery will open only within the iframe and not covering the entire browser window. (This is a limitation of using an iframe but, being that Squarespace do not allow you to upload your gallery files to the web space that they provide using FTP, it is not possible for you to embed a Juicebox gallery using the recommended method.)

An alternative solution would be to simply provide links to your galleries within your web page.
When clicked, each link would redirect the user to a gallery's 'index.html' page to display each gallery on a page of its own. (You would still host your gallery folders on Dropbox.) If doing so, you could then use the Back Button in each gallery to allow the user to return to your home page.

Go to forum: Juicebox-Lite Support

4,049 Reply by Steven @ Juicebox

(9 replies, posted in Juicebox-Lite Support)

The Dropbox link you quoted is, indeed, a download link. It offers the 'index.html' file to the user as a download rather than allowing the user's browser to display its contents like a regular web page.

Have you tried creating a 'Public' folder by logging into your Dropbox account and clicking this link?
https://www.dropbox.com/enable_public_folder

It looks like the <iframe> code itself has been inserted into your Squarespace page correctly. (The problem is just getting a Dropbox public link to your gallery's 'index.html' file.)
If you want to check that the <iframe> code is OK, just replace the Dropbox download link (with is currently used as the 'src' attribute of the <iframe>) with any other web page (such as http://www.google.com) and you should see the web page you choose displayed within your own web page.

Go to forum: Juicebox-Lite Support

4,050 Reply by Steven @ Juicebox

(12 replies, posted in Juicebox-Lite Support)

What I can see is that the option does not allow us to open a new tab but the gallery will stay on the same page in some way.

When using expandInNewPage="TRUE", Juicebox will open the expanded gallery using a new page (the 'full.html' page within the 'jbcore' folder) but within the same tab/window. It is not possible to expand the gallery in a different tab/window.
It looks like something on your web page (most likely some JavaScript) is preventing WebKit browsers (Chrome, Safari and Opera) from opening the gallery using the Fullscreen API, even though your gallery uses useFullscreenExpand="TRUE".
Unfortunately, your web page loads over 20 external JavaScript files and also contains several internal <script> sections so troubleshooting the page may be quite difficult and some trial and error may be required to find the cause of the problem.
I would start by deactivating all plugins to see if the gallery expands as expected and then reactivate your plugins one-by-one (checking the gallery each time) to see if you can find a conflicting plugin. (The problem may or may not be related to the Jetpack plugin.)

I still see a weird display of my September gallery post (main image is very little, with no thumbnails) after I opened November gallery first (from the corresponding post).

I have expanded your September gallery (after expanding and closing your November gallery) in Chrome 32 on my PC but I do not see the issue you describe (though the gallery does not use the Fullscreen API, as I noted above). Perhaps the problem is isolated to WebKit browsers on the Mac.
Try clearing your browser's cache before reloading your web page to ensure that your browser is fetching and using the most recent gallery files from your web server. If your galleries are set up identically (double-check the settings for each gallery), then I would expect them to display and function identically. If your browser is caching and using older gallery files, then this might explain the problem you are reporting.

I notice that when I go to my main page, the http://www.monpetitblog.net web address is replaced by http://www.monpetitblog.net/#1.

Your gallery uses Social Sharing (Facebook) and the # is required to give each image in your gallery a unique URL.

On iPad, after closing a gallery, I am often in a situation in which the infinite scroll won't work anymore within the page...

Again, this sounds like there may be some conflicting JavaScript on your web page causing this problem. (Although, this time, it sounds like it may be a direct conflict between Juicebox and the Jetpack plugin.)
Deactivating and reactivating your plugins might help locate the source of the problem.

Is there any option to open the gallery in a new tab?

A gallery cannot be expanded in a new tab/window but a possible solution would be to simply include links to your galleries in your WordPress posts. You could essentially create your own Splash Pages which would consist of an image (or just text) which link to 100% x 100% galleries in new tabs/windows by using the target attribute of the HTML <a> tag.
A text link to a gallery would look something like this:

<a href="/gallery/index.html" target="_blank">Click here to open gallery in new tab/window.</a>

You could then use the Back Button in your galleries to allow users to return to the original web page.

Go to forum: Juicebox-Lite Support