Wordpress Themes - WP Forum at BFA - NextGEN Slideshow Widget - What CSS Selector to set "Screen Color to a gradient color

Wordpress Themes - WP Forum at BFA (http://forum.bytesforall.com/index.php)

- Atahualpa 3 Wordpress theme (http://forum.bytesforall.com/forumdisplay.php?f=2)

- - NextGEN Slideshow Widget - What CSS Selector to set "Screen Color to a gradient color (http://forum.bytesforall.com/showthread.php?t=19692)

NextGEN Slideshow Widget - What CSS Selector to set "Screen Color to a gradient color

What CSS Selector can be used to set the "Screen Color" of the NexGen Gallery plugin Slideshow Widget?

At the settings for Gallery > Options > Slideshow, it provides a place to set the background color, "Screen Color," and other options. This works to change the "Screen Color", however, it only provides a small blank for a solid color code, and does not accept gradient code in that small blank.

I want to set the "Screen Color" to a gradient color -- to match the gradient color I have set for the background of the widget area in which this widget will display, as follows:

Code:

background: #000000;

background: -moz-linear-gradient(top, #000000, #333333);

background: -webkit-gradient(linear, left top, left bottom, from(#000000), to(#333333));

-moz-border-radius:10px;

-khtml-border-radius: 10px;

-webkit-border-radius:10px;

border-radius: 10px;

Note: the "Screen Color" shows when the slide show rotates an image that is narrower than the width of the slideshow (set in the NextGEN Slideshow Widget), which is set to the width of the widest image in the slideshow. Therefore, I want the screen color to blend into the gradient color of the widget area background.

I have tried adding the above code in every obvious place in the Style Sheet provided by the NextGen plugin, and have also tried many different CSS selectors in ATO Options > Add HTML/ CSS Inserts --- but none seems to work to style the "Screen Color" of the NextGen Slideshow widget.

Help would be much appreciated!!!

We are using Wordpress 3.5.1 with Atahualpa 3.7.10.

Many thanks!

Hi Juggledad,

Thank you for responding. I just sent you a private message with the URL of the page in issue.

Many thanks!

I'm not sure about the screen setting but something like this should work

HTML Code:

#slideshow-2 .widget {

background: gradient code;

}

Your slideshow number will probably be different but if you want to affect other areas you can just use Firebug to see what selectors you need to target.

the background is being set in the plugin in this script put out by the plugin. You'll need to talk to the plugin author about this.

HTML Code:

<script type="text/javascript" defer="defer">

<!--

//<![CDATA[

var sbsl1_1 = {

        params : {

                wmode : "opaque",

                bgcolor : "#111111"},

        flashvars : {

                file : "http%3A%2F%2Fyourdomain.com%2Findex.php%3Fcallback%3Dimagerotator%26gid%3D1",

                shownavigation : "false",

                showicons : "false",

                rotatetime : "4",

                backcolor : "0x000000",

                frontcolor : "0xFFFFFF",

                lightcolor : "0xCC0000",

                screencolor : "0x111111",

                width : "460",

                height : "450"},

        attr : {

                styleclass : "slideshow-widget"},

        start : function() {

                swfobject.embedSWF("http://yourdomain.com/wp-content/uploads/imagerotator.swf", "sbsl1_1", "460", "450", "7.0.0", false, this.flashvars, this.params , this.attr );

        }

}

sbsl1_1.start();

//]]>

-->

</script>

Thanks to both of you, Juggledad and lmilesw.

Yes, I will try to contact the plugin author, as you suggest, Juggledad.
The CSS selector you suggested, lmilesw, does not work to change the "screen color" -- just as the several versions I had tried do not work.

Many thanks.