Image color-change script?

[AKiraVos]

On a website Im trying to add a clickable image:

<a href=""><img src="img.jpg"/></a>

What Im trying to achieve is that the image is in color. I need a script or something that displays the image desaturated / black & white, and as soon as I mouse-over, it should get its original color. I don't want to use 2 images (one in color, one black & white).

I found the CSS property filter: gray, but it only works in IE. So maybe a javascript to manipulate the image to display it in grayscale / black & white?

[djr33]

You'll need to use two images and do a standard rollover. The IE filters are a possible (IE-only) workaround, and so would be using Flash, etc. But browsers in general have no graphics capabilities, so this is not possible.

You could in theory generate the image dynamically so you only have one image on the server, but that would be inefficient as that sort of processing is server-intensive and can be slow; however, you could generate them all at the same time with a script then save the images; that is a reasonable and less-work option.

[AKiraVos]

Ofcourse, I know the option with 2 images and a rollover script. However, thats not what I wanted. I also found out the css filter property option only works with IE and I want cross-browser compatibility, so I will not use that option.

I was thinking that maybe there was some sort of java-script that displays images in grayscales. Maybe jquery has such options? Coudn't find it on the jquery.com website though. Anyone else with some tips for me?