Image Hovers

These are pre-made image link hovers. If you want to make your own, pleas use this code.

• Black and White with Color on Mouseover
  <style type="text/css"> a:link img {filter:gray;} a:visited img {filter:gray;} a:hover img {filter:none;} </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>

• Flip Horizontally on Mouseover
  <style type="text/css"> a:hover img {filter:fliph;} </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>

• Flip Vertically on Mouseover
  <style type="text/css"> a:hover img {filter:flipv;} </style>

• Flipped Vertically with Normal on Mouseover
  <style type="text/css"> a:link img {filter:flipv;} a:visited img {filter:flipv;} 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:progid:dximagetransform.microsoft.emboss;} a:visited img {filter:progid:dximagetransform.microsoft.emboss;} a:hover img {filter:none;} </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> you may change 60 to any number 0 - 100

• 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> you may change 60 to any number 0 - 100
  

CUSTOM CODE:
Image Links Code
<style type="text/css"> <!-- A:link img {border: 1px SOLID BLUE; filter:NONE; hieght:1;} A:visited img {border: 1px SOLID BLUE; filter:NONE; hieght:1;} A:hover img {cursor: HAND; border: 1px SOLID BLUE; filter:NONE; hieght:1;} //--> </style> ADD HOVER CODE(S) IN PLACE OF INSIDE BRACKETS ; change BLUE to any color name or hex code; change HAND to (either) Crosshair, Move, Wait, Help, Text, Url(URLHERE); change 1 to any number 0 - 100; change SOLID to any border style;