Topic: No preloader image with Flickr Gallery
Strange.
I am loading from Flickr. It all works brilliantly. The problem is that the preloader never shows while the Flickr images are being retrieved. I've tested different options to change preloading but none make any difference. There are no errors with file paths. The preloader just doesn't get activated. On most galleries the time to load can be quite long.
My main issue is the "blank" screen during the image loading. Would like to show some feed back indicating it is still working or doing something. I was thinking of using CSS and apply a temporary image until I can get this resolved.
I even set showPreloader to true even though this is the default value. Still, I get the big blank space until the images have loaded from Flickr. I have a very minimalistic setup. I have one jbcore folder and one config.xml using configUrl with common settings. The embed code has unique values like flickr album ID. I also left gallery height and width in the embed code just in case. Those probably could be in the global config.xml but it's working for now so leaving it.
"Global" config.xml
<?xml version="1.0" encoding="UTF-8"?>
<juiceboxgallery
useFlickr="true"
flickrUserName=" "
flickrTagMode="ANY"
flickrImageSize="LARGE"
imagePreloading="NEXT"
showOverlayOnLoad="false"
showSmallBackButton="true"
imageTransitionType="CROSS_FADE"
backgroundColor="rgba(0,0,0,0)"
galleryTitlePosition="NONE"
topAreaHeight="0"
enableLooping="true"
showPagingText="true"
thumbPadding="5"
showAutoPlayButton="true"
buttonBarHAlign="CENTER"
shareFacebook="true"
shareTwitter="true"
sharePinterest="true"
shareTumblr="true"
enableAutoPlay="true"
autoPlayOnLoad="true"
displayTime="6"
goNextOnAutoPlay="true"
captionPosition="NONE"
imageScaleMode="SCALE"
showOpenButton="false"
inactivityTimeout="2"
showPreloader="true"/>
Sample of embed code
<!--START GALLERY EMBED-->
<script src="/gallery/jbcore/juicebox.js"></script>
<script>
new juicebox({
containerId: "gallery-container"
galleryWidth: "100%",
galleryHeight: "80%",
flickrSetId: "xxxxxxxxxxxxxxx", -- this works fine, just don't want to post here yet
galleryTitle: "Band Name Photo Gallery",
configUrl: "/galleries/config.xml",
});
</script>
<div id="gallery-container">
<!--END GALLERY EMBED-->