Topic: Help with background

I have followed the advice on this thread and have everything working perfectly.
http://www.simpleviewer.net/forum/viewt … p?id=13259

My only issue is that there is a large black box surrounding the gallery, even though I have set the gallery options to background"transparent".

I am trying to drop the black box and still keep the semi-transparent fade overlay.

Could you please tell me what I am missing?

Test site here: (only first project works)http://switchitupdesigns.com/test/residential.html

Thank you! smile

Last edited by happypappy (2012-10-27 20:16:52)

Re: Help with background

Add the following code to the end of the 'shadowbox-3.0.3/shadowbox.css' file:

#sb-body, #sb-loading {
    background-color: transparent;
}
Steven Speirs
SimpleViewer Support Team.

Re: Help with background

Thank you Steven!

That worked beautifully. smile

My only issue I see now is that there seems to be a hidden overlay and I can't close the gallery by clicking outside of it. Only way is to click until I find the very outer edge, or use the small x button on bottom right.

Do you see anything that would be causing this?

Re: Help with background

The shadowbox overlay covers the entire browser window. However, if you give your Shadowbox content a border, you will be able to differentiate between the inner part of the Shadowbox coverlay (the gallery) and the outer part of the Shadowbox overlay which can be clicked on (as an alternative to the 'X' close button) to close the overlay.
You can give your Shadowbox content a border, by adding code such as the following to the end of your 'shadowbox.css' file:

#sb-wrapper-inner {
    border: 1px solid #303030;
}
Steven Speirs
SimpleViewer Support Team.

Re: Help with background

I removed that because I didn't want the border showing. Didn't look that nice. Is there a way to re-size the inner part of the overlay so there is more space to click the outer overlay(close window portion)?

BTW - Thanks for your awesome customer service and speedy replies. This is by far one of the best support forums I use. Keep up the great work!  big_smile

Re: Help with background

Keep your gallery's dimensions at 100% x 100% (in the embedding code of the gallery's 'index.html' page) but change the size of your Shadowbox by changing the 'rel' attribute in the corresponding link from:

rel="shadowbox"

... to something like:

rel="shadowbox;height=800;width=600"
Steven Speirs
SimpleViewer Support Team.

Re: Help with background

Thanks!

Is there a way to make the transparency a little darker?

Re: Help with background

This can be changed by setting the Shadowbox overlayOpacity configuration option to an appropriate value between 0 and 1. The default value is 0.5.
In the <head> section of your page, change:

Shadowbox.init();

... to:

Shadowbox.init({ overlayOpacity: 0.8 });

I do not know if you are aware but, for reference, the Shadowbox web site has a full list of configuration options, usage instructions and its own forum.

Steven Speirs
SimpleViewer Support Team.