View RSS Feed

jscheuer1

Styling Descriptions for Ultimate Fade-in slideshow (v2.1)

Rate this Entry
There are actually 4 css selectors that can figure in this. Only three of them really matter. If you only have one show on your page, you only need to think about the last two. The selectors are:

  1. The id of the show, #fadeshow1, for example.

  2. .fadeslidedescdiv - the class for all description containers.

  3. .descpanelbg - the class for all description backgrounds.

  4. .descpanelfg - the class for all description foregrounds.


Though it can be used for some things, you can safely ignore .fadeslidedescdiv in almost all cases. The background panel controls the background color and opacity of the background color for the descriptions. Any background color or opacity you want to enforce here must use the !important keyword in order to override the script's internal styles for these. The foreground panel may be used to style the color and font of the description. It's font styles need no override, but it's color styles do.

So, for example, if you wanted to change the background to red, the color to black and the font to Comic Sans MS:

Code:
.descpanelbg {
	background-color: red!important;
}
.descpanelfg {
	font-family: 'comic sans ms', sans-serif;
	color: black!important;
}
You can change the font-size, line-height, pretty much anything you want. And the above method of using the selectors will work fine as long as you either have only one slide show on the page, or wish to style the descriptions in all slide shows on the page in the same manner.

In cases where there are more than one show on the page and you want your customization to apply to only one show, use its wrapper id as a prefix, ex:

Code:
#fadeshow1 .descpanelfg {
	font-family: 'comic sans ms', sans-serif;
	color: black!important;
}

Submit "Styling Descriptions for Ultimate Fade-in slideshow (v2.1)" to del.icio.us Submit "Styling Descriptions for Ultimate Fade-in slideshow (v2.1)" to StumbleUpon Submit "Styling Descriptions for Ultimate Fade-in slideshow (v2.1)" to Google Submit "Styling Descriptions for Ultimate Fade-in slideshow (v2.1)" to Digg

Tags: None Add / Edit Tags
Categories
DD Scripts Mods , CSS related

Comments