You are not logged in. Please login or register.
Juicebox Support Forum → Posts by Steven @ Juicebox
Try the new version of the Juicebox skin (v1.3.1.0) which can be downloaded from this page.
I have changed setPreferredSize to setSize and I notice a difference (though I have never needed to resize the settings window to show all the controls on the tabs you mentioned).
Hopefully it fixes the problem. If not, I'll just remove the 'smart' window sizing in the next version of the skin.
OK, did that, but most of the remaining errors are from juicebox noscript area.
These errors are due to your image filenames having spaces in them. It is true that the spaces should be encoded but as the image filenames form part of a URL when uploaded to your web server, it would be wise to use only web-safe characters.
Please see section 2.3 of this document for details.
Characters that are allowed in a URI but do not have a reserved purpose are called unreserved. These include uppercase and lowercase letters, decimal digits, hyphen, period, underscore, and tilde.
Still not sure where you placed #message to get it to show.
On further investigation, my code works fine in a gallery using default settings.
However, when using the settings from your gallery's XML file, the message is, indeed, hidden when not using the 'z-index' value. Using the z-index: 9999; value seems to solve the problem fine.
Here is a test gallery [test gallery removed] using a couple of my own images and the configuration options from your gallery.
The message is not ideally placed but should be overlapping the main image and should be clearly visible at all times (until it fades out).
Wouldn't it be easier to simply delay loading the gallery until after the msg fades?
You could do this if you like but the solution above works fine (at least in my test gallery) and avoids having to introduce an unnecessary delay before the gallery starts to load.
I also wanted the caption between the thumbnails (on top) and the main image (on bottom) but when I do that they only intermittently appeared.
On further investigation, this is due to a bug which appears only when using imageTransitionType="CROSS_FADE" in conjunction with setting the captionPosition to either BELOW_IMAGES or BOTTOM.
I have logged a bug report and the issue should be fixed in the next version of Juicebox-Pro but, until then, a suitable workaround might be to use imageTransitionType="FADE" instead.
This bug has now been fixed in v1.3.1. Please see the Version History for a full list of changes and the Upgrading Juicebox page for details on how to get the latest version.
This bug has now been fixed in v1.3.1. Please see the Version History for a full list of changes and the Upgrading Juicebox page for details on how to get the latest version.
This bug has now been fixed in v1.3.1. Please see the Version History for a full list of changes and the Upgrading Juicebox page for details on how to get the latest version.
The link will point towards the HTML page into which the gallery is embedded but the specified image will be selected in the gallery.
Each image does not have a unique HTML page but images are identified within a gallery using a # character in the URL.
For example, if you wanted to share the 7th image in a gallery, the link (automatically generated) would look something like this:
http://www.example.com/gallery/index.html#7
When opening the settings window with the Juicebox skin active, the settings window should not be larger than your monitor's screen. It's maximum height should be no greater than the maximum height of your screen and a vertical scrollbar should appear if necessary.
If this does not seem to be true on your system, try opening the skin's 'onload.bsh' file in a plain text editor and change the instance of window.settingsWindow.setPreferredSize (near the end of the file) to window.settingsWindow.setSize (and then reload the skin) to see if this makes a difference.
Failing that, try deleting everything after the window.pack(); line (in the same 'onload.bsh' file) to see if this helps.
Yes, this is the solution but I see this is a problem with 1.3. I have used this all the time with the previous Juicebox.net. I am using a local cdn named data.delosgaia.nl and this is working fine for all my javascript and CSS files.
It looks like there is a cross-domain/subdomain issue with loading fonts.
Please see the accepted answer to the question in this forum thread for a possible solution.
How can I turn this option completely off
This is not possible. Juicebox-Pro now enables the # identifier automatically to allow social sharing of a specific image.
Try fixing the HTML errors on your http://www.frontiernet.net/~debartsserv … rgallery2/ page. You can check the validity of your code with the W3C Markup Validation Service.
Using the original code I posted above (without the 'z-index' value) seems to work OK for me. I repositioned the message so that it was on top of the image area and the message was not obscured by the gallery as it loaded.
I notice that your gallery's XML file now has a duplicate textColor attribute and I now realise what is going on.
Prior to Juicbeox v1.3.0, certain configuration options (textColor, thumbFrameColor, useFullScreenExpand and useThumbDots) were Pro-only. However, these options were changed to Lite in v1.3.0 and the jAlbum skin now enters these options into the XML file using the values chosen in the interface. If you have any of these options listed in the Pro Options text area, then there will be duplicate attributes in the XML file causing the problem you have reported.
I will ensure that the next version of the skin does not allow Lite entries from the Pro Options text area to be entered into the XML file. Until then, remove the above options from your Pro Options text area (or directly from the XML file itself) and all should be well.
The first problem is likely to be due to your gallery's 'jbcore' folder being hosted on a different subdomain to the page containing your gallery's JavaScript embedding code. All gallery files should be on the same domain or subdomain as the JavaScript embedding code. Try hosting the 'jbcore' folder on your http://afrika.delosgaia.nl subdomain.
With regard to the second image being the first one displayed, the link you provided has a #2 at the end of it signifying that Juicebox should go directly to the second image.
When viewing your web page, I sometimes see only a slim AutoPlay Juicebox gallery.
Other times I load your page, I see a completely different Juicebox gallery with thumbnails.
Another time, both galleries were displayed with a map at the bottom of the page (same computer, same browser, same monitor).
Your web page is not being rendered consistently and, as I cannot always view the gallery in question, it is difficult to try to determine the problem.
However, I have not been able to replicate the problem using the configuration options from the XML file whose URL you posted above.
Try viewing your own gallery on a page of its own (by placing a 'jbcore' folder and a stock 'index.html' file inside your gallery folder and opening the 'index.html' file in a browser) to see if the first or second image is initially displayed.
Also, as you have set changeImageOnHover="TRUE", make sure that your cursor is not in the thumbnail area when the gallery loads (or the image corresponding to the thumbnail that the cursor is over will be displayed).
When laying out a gallery, Juicebox essentially reserves enough space for the thumbnails and then allocates the remainder for the main images.
If your thumbnails are positioned below the main images, then the height of thumbnail area will be only what is required and setting thumbsVAlign="TOP" will make little or no difference. (It will be much more noticeable when positioning the thumbnails LEFT or RIGHT.)
Perhaps your main images are not large enough to fill the image area.
Try either increasing the resolution of the main images in your gallery, setting imageScaleMode="FILL" or reducing the height of your gallery.
There is a problem with your test gallery's XML file: http://www.billanddot.com/jalbum-juiceb … config.xml
There is a duplicate attribute: useFullscreenExpand="TRUE"
Try removing this to see if it helps.
This feature is now available in Juicebox-Pro v1.3.0.
Use the languageList configuration option. Please see here for details.
For example, if you simply wanted to change only the thumb paging text from 'of' to 'des', then use the following:
languageList="Show Thumbnails|Hide Thumbnails|Expand Gallery|Close Gallery|Open Image in New Window|Next Image|Previous Image|Play Audio|Pause Audio|Show Information|Hide Information|Start AutoPlay|Stop AutoPlay|AutoPlay ON|AutoPlay OFF|Go Back|Buy this Image|Share on Facebook|Share on Twitter|Share on Google+|Share on Pinterest|Share on Tumblr|des"Try using a high 'z-index' value for the message <div> so that it is stacked on top of all other elements on your web page, e.g.:
#message {
z-index: 9999;
}The link will be to the web page into which the gallery is embedded.
If you embed your Juicebox gallery into an existing web page alongside other content, then the gallery's own 'index.html' file is not required and you do not need to upload it to your web server.
Is there a way to add an <hr> between thumbs and image?
No. Introducing a new element with a finite height would likely displace other elements within the gallery.
I also wanted the caption between the thumbnails (on top) and the main image (on bottom) but when I do that they only intermittently appeared.
Using thumbsPosition="TOP" and captionPosition="BELOW_THUMBS" should work OK (though you may need to change the default value for the maxCaptionHeight configuration option). If your captions display only intermittently, please post the URL to your gallery so that I can take a look.
Also, is there a way to subtly hint that autoplay is available? I am thinking maybe some kinda of timer with a notice "Use spacebar to autoplay gallery images" for a few seconds before loading in the gallery?
There are many ways in which this could be achieved.
Here is a simple example (using jQuery) which displays a message and automatically fades it out after 5 seconds.
Create a sample gallery with JuiceboxBuilder-Pro and use the code below as your gallery's 'index.html' file.
<!DOCTYPE html>
<html lang="en">
<head>
<title>Juicebox-Pro Gallery</title>
<meta charset="utf-8" />
<meta name="apple-mobile-web-app-capable" content="yes" />
<style type="text/css">
body {
margin: 0px;
}
#message {
background-color: #acc2e3;
position: absolute;
top: 50px;
left: 20px;
font-size: 20px;
-moz-border-radius: 15px;
-webkit-border-radius: 15px;
border-radius: 15px;
width: 350px;
text-align: center;
}
</style>
</head>
<body>
<!--START JUICEBOX EMBED-->
<script src="jbcore/juicebox.js"></script>
<script>
new juicebox({
containerId : 'juicebox-container'
});
setTimeout(function(){
$("#message").fadeOut("slow");
}, 5000)
</script>
<div id="juicebox-container"></div>
<div id="message">Use spacebar to autoplay gallery images.</div>
<!--END JUICEBOX EMBED-->
</body>
</html>If you like, you can post suggestions in for future versions in the Feature Requests thread.
Path to jbCore folder and juicebox.js:
The path to the jbcore folder has to be a relative path in relation to the page else the fonts are not displayed. You will get numbers.
Are you able to provide an example of this? I have used an absolute path to the 'juicebox.js' file and also a path with a leading slash but have been unable to replicate this problem.
IE8: The font symbols are a square and not round
This is a known issue with IE8 which we are currently investigating.
FirstImageIndex
The gallery start at picture two and not one when the gallery loads
I am unable to replicate this issue. Setting firstImageIndex="1" in a Juicebox-Pro v1.3.0 test gallery initially displays the first image as expected. Can you please provide an example of this issue? Thanks.
BackgroundUrl:
Background picture is not displayed, I load the background picture in the new juicebox. It is displayed for a split second and disappears.
This issue has already been addressed and will be fixed in the next version of Juicebox-Pro.
You can set the thumbnail dimensions on the 'Images' tab of JuiceboxBuilder-Pro and the application will set the thumbWidth and thumbHeight values in the gallery's XML file accordingly.
However, all the thumbnails will share the same dimensions. This cannot be changed.
We aim to release a fix for this bug as soon as possible but, in the meantime, try loading the 'jquery-1.9.1.min.js' file after the 'juicebox.js' file on your web page. I cannot be certain that your jQuery functions will work as expected but my tests show that the gallery should display OK.
Fotomoto support has been included in Juicebox-Pro v1.3.0.
Please see here for details.
For reference (and others reading this post), instructions for installing the Juicebox Lightroom plugin can be found here.
If you are having trouble copying the 'juicebox.lrwebengine' package to the correct location, perhaps this more detailed explanation of how to install a Web Engine on a Mac will help. (Although the instructions are not specifically for the Juicebox plugin, installation for all Web Engines is the same.)
I notice that your galleries do not display at all on IE10 (though they do display in Firefox, Chrome, Safari and Mobile Safari).
Try viewing the galleries on their own pages (rather than embedded in your main pages) to see if this makes a difference:
http://centerlinegraphicdesign.com/Home … arkup.html
http://arabian-training.com/Home_files/ … arkup.html
The galleries themselves do display OK in IE10 when I view them on their own so they may also display OK on your Android device.
This suggests that there is something that both IE10 and your Android browser do not like about the way the galleries are being embedded using the iWeb widget.
It may have something to do with the fact that your main pages use the XHTML 1.0 Transitional Doctype Declaration (with a missing xmlns attribute for the 'html' element) whereas your gallery pages (used by the iWeb widget within your main page) use the HTML 4.01 Transitional Doctype Declaration.
Try matching the Doctype Declarations for all your pages to see if this helps (and, if using the XHTML 1.0 Transitional Doctype Declaration, fix the missing missing xmlns attribute for the 'html' element on your main pages).
At the moment, the use of the imageURL for Fotomoto is hard-coded into the 'juicebox.js' file (which is obfuscated and cannot be modified). Please post this suggestion in the Feature Requests thread where it will not be overlooked. I cannot promise that it will be included in a future version but I agree that it would be a good idea.
Juicebox Support Forum → Posts by Steven @ Juicebox
Powered by PunBB, supported by Informer Technologies, Inc.