hi5 Forums

[Andrew]

Widgets (Footer)


Background Options


Choose Footer Background Color:

Code: Select all

#widgets .footer {background-color: -color?-;}

-color?- = Any Hex code, RGB value or HTML name Color Code

Formats:
(1) Hex code (#FF0000)
(2) RGB value (rgb(255,0,0))
(3) HTML name (red)

Examples:
#widgets .footer {background-color: #FF0000;}
#widgets .footer {background-color: rgb(255,0,0);}
#widgets .footer {background-color: red;}

[Click Here to view list of Color Codes]
http://www.hi5-world.com/ColorCodes.htm



Choose Footer Image:

Code: Select all

#widgets .footer {background-image: url(-url?-);}

-url?- = Any image url

Example:

#widgets .footer {background-image: url(http://forums.hi5-world.com/images/FooterBackground.jpg);}



Background Repeat:

Code: Select all

#widgets .footer {background-repeat: -repeat?-;}

[?] -repeat?- = Any of the below options

[1]repeat : The background image will be repeated vertically and horizontally.
[2]repeat-x : The background image will be repeated horizontally.
[3]repeat-y : The background image will be repeated vertically
[4]no-repeat : The background-image will be displayed only once

Example:
#widgets .footer {background-repeat: no-repeat;}



Background Position:

Code: Select all

#widgets .footer {background-position: -x-% -y-%; background-attachment: fixed;}

Horizontal Position: -x-%
Vertical Position: -y-%

Position Values must be between 0 - 100%

Example:

#widgets .footer {background-position: 20% 65%; background-attachment: fixed;




Visibility Options


Opacity

Code: Select all

#widgets .footer {filter:alpha(opacity=IE??); opacity: FF??;}

IE?? = any integer value from 0 - 100

FF?? = Must be 1/100th of the previous IE?? value.
(or IE?? X 0.01)

Example:
#widgets .footer {filter:alpha(opacity=70); opacity: 0.7;}



Hide Footer

#widgets .footer{display: none;}




Hover Effects

Code: Select all

#widgets .footer :hover {-Code Here-;}

By substituting,

#widgets .footer
for
#widgets .footer :hover

All of the above codes, (Background Options, Text Options, Visibility Options), can be used to give a different effect on the target, when the Mouse Pointer is hovered over the object in the Widgets (Footer).

Example:
#widgets .footer :hover {background-image: url(http://forums.hi5-world.com/images/FooterBackground_Hover.jpg);}

This will give you a different background image when you hover over the Widgets (Footer)