Home       About       Cartoon Doll Makers       Cartoon Dolls       Glitters       Tutorials       Entertainment   

Candy Delight

Home Add to Favourites Contact Us Support Us

Cartoon Doll Makers

Shuni Doll Maker Shuni Dress Doll Maker Unique Doll Maker Unique Swimmer Maker Evil Fairy Bonita Doll Maker Bonita Christmas Doll Maker Wonderkin Doll Maker View All Dollmakers?

Advertisements

Glitters

Love Glitters Baby Glitters Birthday Glitters Chat Speak Glitters Christmas Glitters College Glitters Compliment Glitters View All Glitters?

Visitor

Backgrounds Neopets Links Scrollbars Website Namer View All?

Tutorials

Website Tips Making & Using transparent fills Making a glitter Basic text effects Awards in Paint View All?

Interaction

Button Wall Guest Book Tagboard View All?

Link Effects

Here are a couple of link effects I've gathered since I started website design.


Line through (When Hovered over) < style type="text/css" > <STYLE type="text/css"><!-- A:link{color:COLOUR HERE;text-decoration:none} A:visited{color:COLOUR HERE;text-decoration:none} A:active{color:COLOUR HERE;text-decoration:none} A:hover{color:COLOUR HERE;text-decoration:line-through} --></STYLE>


Backwards (When hovered over) <u><style type="text/css">a:hover{filter:fliph(color:#FF0000, strength=3);height:10px;width:inherit}</style>


Fading link <style> a:hover, a:link, a:visited {filter:blur; .alpha {width: inherit; height: 1; filter: alpha (Opacity=100, FinishOpacity=20, Style=1, StartX=0, StartY=0, FinishX=580, FinishY=0);} </style>


Spaces between the letters (when hovered over) <style type="text/css">a:hover {letter-spacing:2px}</style>


Upside down link (When hovered over) <STYLE TYPE="text/css"><!-- A:link {text-decoration: none; color:9797B0;} A:visited {text-decoration: none; color: 9797B0;} A:active {text-decoration: none; color:9797B0;} A:hover {color:#9797B0;text-decoration:none;filter:glow(color=put color in hex or text); letter-spacing:1px;height:0;border-width:1;border-width:1px;filter:flipv;}--></style>


Italic (When hovered over) <STYLE TYPE="text/css"> a.italic:link { color: green; text-decoration: none } a.italic:active { color: yellow; text-decoration: none } a:italic:visited { color: green; text-decoration: none } a.italic:hover { color: orange; text-decoration: underline; font-style: italic} </STYLE>


All Capitals (When hovered over) <STYLE type="text/css"><!-- a:hover {text-transform:uppercase; }//--> </STYLE>


Background Colour (When hovered over) <!-DHTML scripts by Dynamic Drive (http://www.dynamicdrive.com)--> <STYLE> a:hover{background-color:Put the colour you want the background to be here; } </STYLE>


Line over and under (When hovered over) <STYLE type="text/css"><!-- A:link{color:COLOUR HERE;text-decoration:none} A:visited{color:COLOUR HERE;text-decoration:none} A:active{color:COLOUR HERE;text-decoration:none} A:hover{color:COLOUR HERE;text-decoration:underline overline} --></STYLE>


Underlined (When hovered over) <STYLE type="text/css"><!-- A:link{color:COLOUR HERE;text-decoration:none} A:visited{color:COLOUR HERE;text-decoration:none} A:active{color:COLOUR HERE;text-decoration:none} A:hover{color:COLOUR HERE;text-decoration:underline} --></STYLE>


Makes the text a bit bigger (When hovered over) <STYLE TYPE="text/css"> a.link { color: green; text-decoration: none } a.active { color: yellow; text-decoration: none } a:visited { color: green; text-decoration: none } a.hover { color: orange; text-decoration: underline; font-size:15pt } </STYLE>


Bold (When hovered over) <STYLE TYPE="text/css"> a.link { color: green; text-decoration: none } a.active { color: yellow; text-decoration: none } a:visited { color: green; text-decoration: none } a.hover { color: orange; text-decoration: underline; font-weight: bold} </STYLE>


Dotted Underline (When hovered over) A:hover{color:#COLOURHERE; font-weight: bold;text-decoration: none; background-color: transparent; border-color: #COLOURHERE; border-bottom-width: 1px; border-left-width: 0px; border-right-width: 0px; border-top-width: 0px; border-style: dotted;}


Glow (When hovered over) <style type="text/css"><!--A:hover {filter:Glow(color=COLOR CODE HERE,strength=4);height:0px;}//--></style>



I hope this Helped! Please link back if so! Tutorial © Michelle @ Candy-Delight.net

Vote?

Link Back

<a href="http://candy-delight.net"><img src="http://i124.photobucket.com/albums/p24/jaffa-cakes/layout/5-1.gif" border="0" alt="Cartoon Dolls, Cartoon Doll makers, Dressup Games"></a>

Tagboard

Affiliates

Myspace Glitters Girls Games Build Dolls Dolls Bliss Girls Games Best Myspace Comments Free Myspace Layouts Girly Myspace Layouts New Myspace Layouts Fashion Myspace Layouts Doll Allure My Secret Dolls Dress Game Fun Want More?

Please Note

We do not permit copying, redistrebution, nor do we permit direct linking, unless you are given a code. If you are caught doing any of these acts we will be forced to report you to your website hosting company.