Simple css3 greyscale image on hover

If you would like to hover over an image and make it greyscale with no hastle what so ever, then this demo is ideal for you:


img{ height: 350px; } //height is not needed

img:hover

{

-webkit-filter: grayscale(1);

-webkit-filter: grayscale(100%);

-moz-filter: grayscale(100%);

filter: gray; filter: grayscale(100%);

filter: url(desaturate.svg#greyscale);

}


Click HERE FOR DEMO

 

 

Enjoy 🙂