Image Hover Codes

Chinito dice...

*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><br />





*Flip Horizontally on Mouseover


<style type="text/css"> a:hover img {filter:fliph;} </style><br />




*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><br />




*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><br />





*Blur on Mouseover



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





*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><br />




*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><br />





*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><br />





*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><br />





*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><br />




*Invert Colors on Mouseover



<style type="text/css"> a:link img {filter:none;} a:visited img {filter:none;} a:hover img {filter:invert;} </style><br />





*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><br />




*X-ray on Mouseover



<style type="text/css"> a:link img {filter:none;} a:visited img {filter:none;} a:hover img {filter:xray();} </style><br />





*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><br />




*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><br />





*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><br />