Display colored images in greyscale on web page

How can I convert images on my website into greyscale? I don't care if it's PHP or JS, but I think PHP is nicer.

In particular I have a blog with various posts containing images, and I want the thumbnail images that preview the blog post on the index page to be greyscale while the represented images in the blog post stay colored. These thumbnail images share a class called .post-thumbnail there the img tag is inside the element with that class.

All I want is something that would look like this in 开发者_运维技巧CSS is there would be that property:

.post-thumbnail img { image-transform: greyscale; }

In PHP or JS.

Quick search on StackOverflow finds this:

$im = imagecreatefrompng('dave.png');
imagefilter($im, IMG_FILTER_GRAYSCALE);
imagepng($im, 'dave.png');

See Making an Image Greyscale with GD Library