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 🙂