grayscale to color image roll over effect

Envato Authors Theme Authors
1

Hi guys!

I’m looking for a cross browser grayscale to color image roll over effect.
I’ve found few tutorials but not the definitive one.

any advice?
thx

2

Hi,

Check the following information http://www.gomediazine.com/tutorials/full-color-rollovers-in-flash/

Hope this information helps you.

Im a nobody… nobodys perfect… therefore IM PERFECT!!!

3
amandasmith86 said

Hi,

Check the following information http://www.gomediazine.com/tutorials/full-color-rollovers-in-flash/

Hope this information helps you.

Im a nobody… nobodys perfect… therefore IM PERFECT!!!

thanks but I’m looking fro a css/html/jquery solution.

4

Maybe something like this: HTML5 Grayscale Image Hover?

5
Smuliii said

Maybe something like this: HTML5 Grayscale Image Hover?

Thanks!
Yes, I saw this tuto.
Unfortunately this is not crossbrowser.

there should be another way!
Cheers!

6

I google something for you http://bavotasan.com/2009/creating-a-jquery-mouseover-fade-effect/

All the best :wink:

7
laranz said

I google something for you http://bavotasan.com/2009/creating-a-jquery-mouseover-fade-effect/

All the best :wink:

thanks!

In this example you need to include 2 images… it doesn’t work for me.

I’ve found this tuto:http://www.ajaxblender.com/howto-convert-image-to-grayscale-using-javascript.html

opinions?

8

Finally I got something:

http://dev.artutkin.ru/desaturate/

Testing!

9

You could also check my Practica theme. It uses a cross-browser and color-accurate script for grayscale-to-color effects.

10
crozer said

You could also check my Practica theme. It uses a cross-browser and color-accurate script for grayscale-to-color effects.

@crozer It seems that your html template has 2 thumbnails (color and b&w). I need just one full color image.

thx

11
JuanTomasoli said
crozer said

You could also check my Practica theme. It uses a cross-browser and color-accurate script for grayscale-to-color effects.

@crozer It seems that your html template has 2 thumbnails (color and b&w). I need just one full color image.

thx

I meant the WP version :wink:

12
crozer said
JuanTomasoli said
crozer said

You could also check my Practica theme. It uses a cross-browser and color-accurate script for grayscale-to-color effects.

@crozer It seems that your html template has 2 thumbnails (color and b&w). I need just one full color image.

thx

I meant the WP version :wink:

It looks like you used canvas based on the huge amount of data.

13
crozer said
JuanTomasoli said
crozer said

You could also check my Practica theme. It uses a cross-browser and color-accurate script for grayscale-to-color effects.

@crozer It seems that your html template has 2 thumbnails (color and b&w). I need just one full color image.

thx

I meant the WP version :wink:

OH! I will check it later! thanks!!