Topic: Background-color screenmode =small

Hi,

I'm trying to find out how to set the background color when using a screenmode forced to small? Nothing I do seems to have any effect? Not in altering the backgroundcolor logical because that is only for large screens... But also I cannot find anything in the css that will work?

Thanks!

Re: Background-color screenmode =small

p.s. there also is a large padding around the collection of thumbnails in the small screen view? Where can I alter this?

Re: Background-color screenmode =small

I'm trying to find out how to set the background color when using a screenmode forced to small?

Setting the 'Background Color' in JuiceboxBuilder-Pro (in the 'Customize -> Lite' section) will set the gallery's background color for both Small and Large Screen Modes. Just make sure that the 'Opacity' is greater than zero. Otherwise the background color will be 100% transparent.
(The background color is set in the gallery's embedding code, as can be seen in the sample code in the Juicebox - Embedding Guide.)

p.s. there also is a large padding around the collection of thumbnails in the small screen view? Where can I alter this?

In Small Screen Mode, the number of thumbnails is automatically calculated to fill the available space. This cannot be changed.
If there is more than enough space in the user's browser window to display all the thumbnails, then there may also be space surrounding the thumbnails. However, in a small browser window, fewer thumbnails will be displayed and there will also be less space surrounding the thumbnals.
Please see the Screen Modes support section for further information.

4 (edited by carsten@grevink.net 2013-01-29 20:09:22)

Re: Background-color screenmode =small

Thanks for your answers!

I can change the background color as you describe, but as soon as i force the screensize to small the background switches to black again?? Is this a bug or the intended functionality??

Furthermore is there a way to influence (via a custom css) the padding around the thumbnail view because I think it is a little to large.. Thanks!

Re: Background-color screenmode =small

I can change the background color as you describe, but as soon as i force the screensize to small the background switches to black again??

The background color should remain consistent between the Small and Large Screen Modes.
Please post the URL to your gallery so that I can take a look.

Furthermore is there a way to influence (via a custom css) the padding around the thumbnail view because I think it is a little to large.. Thanks!

You can spread the thumbnails out more by increasing the value of the thumbPadding configuration option.
If using JuiceboxBuilder-Pro to create or edit your gallery, this configuration option can be found in the 'Customize -> Thumbnails' section.

Re: Background-color screenmode =small

Ok, so I started to doubt myself and had another look... I downloaded a new version of juicebox and only made some minor configuration to make it easier to see the problem.

You can find the gallery on: http://www.grevink.net/JuiceboxTest/index.html

I changed the background to white, forced the screensize to small and there is again a black background

Furthermore is added a fixed with and height and set the spashpage to never, for you to see the large amount of space around the thumbnails? There could easily fit more thumbs on the area... The padding is just to large maybe due to the arrows? But still above and below is al lot of space?

Re: Background-color screenmode =small

Ok, so I started to doubt myself and had another look... I downloaded a new version of juicebox and only made some minor configuration to make it easier to see the problem.

You can find the gallery on: http://www.grevink.net/JuiceboxTest/index.html

I changed the background to white, forced the screensize to small and there is again a black background

Thank you for providing the URL to your gallery.
I notice that your gallery uses Juicebox-Pro v1.0.2. Please upgrade to the current version (v1.2.0) following the instructions here as many bugs have been fixed and new features have been introduced since v1.0.2. Please see the Version History for a full list of changes.

Furthermore is added a fixed with and height and set the spashpage to never, for you to see the large amount of space around the thumbnails? There could easily fit more thumbs on the area... The padding is just to large maybe due to the arrows? But still above and below is al lot of space?

The number of thumbnails is automatically calculated to fill the available space. The only ways to have Juicebox display more thumbnails per page is to reduce the dimensions of the thumbnails via the thumbWidth and thumbHeight configuration options or to reduce the amount of thumbPadding.

Re: Background-color screenmode =small

Thanks, I somehow managed to mix up the different versions I had... Using the new version solved the first problem!

I had a look at the thumbnail parameters and this help a bit but still there is a lot of space around the set of thumbnails that is not used what is strange since the small screen layout is made for small screens?
I tried some custom css but i'm only able to move the navigation around and not do anything with the space reserved for the thumbs and the amount being showed.. Is it correct that this cannot be altered by changing the css?

Re: Background-color screenmode =small

The layout of the thumbnails on the thumbnail page in Small Screen Mode is partly determined by the code within the 'juicebox.js' file which is obfuscated and cannot be modified. It is not possible to change this functionality via CSS alone, although the tips I provided above (using Thumbnail configuration options) may help a little.