Hover Codes

Effects incompatible with all browsers are marked with a *. For image hover effects, please scroll down!

Insert below code in the A: Hover brackets ( ).
<style type="text/css"> <!-- A:visited {color:COLOR; text-decoration: none;} A:link {color:COLOR; text-decoration: none;} A:active {color: COLOR; text-decoration: underline;} A:hover {cursor: HAND; color: BLUE; text-decoration: underline;} //--> </style>

*Glow Links on Mouseover (colors)
filter:Glow(color=COLOR,strength=4);height:0px;

*Drop Shadow Links on Mouseover (colors)
filter:DropShadow(color=COLOR,strength=4);height:0px;

*Shadow Links on Mouseover (colors)
filter:Shadow(color=COLOR,strength=4);height:0px;

*Blur Links on Mouseover
filter:blur(add="1",direction="360",strength="4"); height:0;

Highlight Links on Mouseover (Colors)
background-color:COLOR;

Grey Links on Mouseover
filter:gray(); height:0;

Mask Links on Mouseover
filter:mask; height:0;

*Wave Links on Mouseover
filter:Wave(strength=4);height:0px;

Invert Colors of Links on Mouseover
filter:invert(); height:0;

CAPITAL Links on Mouseover
text-transform:uppercase;

lowercase Links on Mouseover
text-transform:lowercase;

Image Hover Codes

*Black and White with C olor on Mouseover
<style type="text/css"> a:link img {filter:gray;} a:visited img {filter:gray;} a:hover img {filter:none;} </style>

*Flip Horizontally on Mouseover
<style type="text/css"> a:hover img {filter:fliph;} </style>

*Color with Black and White on Mouseover
<style type="text/css"> a:link img {filter:none;} a:visited img {filter:none;} a:hover img {filter:gray;} </style>

*Flipped Horizontally with Normal on Mouseover
<style type="text/css"> a:link img {filter:fliph;} a:visited img {filter:fliph;} a:hover img {filter:none;} </style>

*Blur on Mouseover
<style type="text/css"> a:hover img {filter: blur(add = 0, direction = 225, strength = 10)}</style>

*Blurred with Normal on Mouseover
<style type="text/css"> a:link img {filter:blur(add = 0, direction = 225, strength = 10);}a:visited img {filter:blur(add = 0, direction = 225, strength = 10);}a:hover img {filter: none}</style>

*Emboss on Mouseover
<style type="text/css"> a:link img {filter:none;} a:visited img {filter:none;} a:hover img {filter:progid:dximagetransform.microsoft.emboss;} </style>

*Embossed with Normal on Mouseover
<style type="text/css"> a:link img {filter:none;} a:visited img {filter:none;} a:hover img {filter:progid:dximagetransform.microsoft.emboss;} </style>

*Engrave on Mouseover
<style type="text/css"> a:link img {filter:none;} a:visited img {filter:none;} a:hover img {filter:progid:dximagetransform.microsoft.engrave;} </style>

*Engraved with Normal on Mouseover
<style type="text/css"> a:link img {filter:progid:dximagetransform.microsoft.engrave;} a:visited img {filter:progid:dximagetransform.microsoft.engrave;} a:hover img {filter:none;} </style>

*Invert Colors on Mouseover
<style type="text/css"> a:link img {filter:none;} a:visited img {filter:none;} a:hover img {filter:invert;} </style>

*Inverted Colors with Normal on Mouseover
<style type="text/css"> a:link img {filter:invert;} a:visited img {filter:invert;} a:hover img {filter:none;} </style>

*X-ray on Mouseover
<style type="text/css"> a:link img {filter:none;} a:visited img {filter:none;} a:hover img {filter:xray();} </style>

*X-rayed with Normal on Mouseover
<style type="text/css"> a:link img {filter:xray();} a:visited img {filter:xray();} a:hover img {filter:none;} </style>

*Transparent on Mouseover
<style type="text/css"> a:link img {filter:none;} a:visited img {filter:none;} a:hover img {filter:alpha(opacity=60);} </style>

*Transparent with Normal on Mouseover
<style type="text/css"> a:link img {filter:alpha(opacity=60);} a:visited img {filter:alpha(opacity=60);} a:hover img {filter:none;} </style>