Greyscale to colour on hover - Best method

[west end lane]

Hi,

Would like to have this effect on one of my pages.

Have tried using this tut:

HTML5 Grayscale Image Hover

But getting mixed results on my MAMP setup. i.e. Firefox and Chrome not showing at all. Safari only shows the colour image on hover.

There is a note suggesting this may be the case in a local set up - why would this be the case? I'm kinda weary rolling it out live only to find it's still not working.


Is there a better method/tut that anyone could suggest/post?

Grateful for any replies.

Rob

[CyberAlien]

Make sure images are located on same host where you are loading page from. Canvas can't be used to manipulate images loaded from other servers, its one of security features.

[west end lane]

Thanks Cyber.

So there is a good chance this should work once I put it live?

Will give it a go and see what happens then.


Cheers

[CyberAlien]

Copy all images to your local installation and test it instead of loading images from live server. If it won't work, it won't work on live ether.

[west end lane]

Hi,

Yep tried that and no joy. Seems quite a few have had trouble with this script so will try a different method to get the effect.

Could anyone point me to a working example/tutorial to work on?

Thanks