Image Fade On Mouse Over

I have a wallpaper gallery based on 4images script.
To give my gallery more attractive i want when any one move mouse on any thumbnail it show a fade out or fade in effect and when mouse move from thumbnail it come back to original...
Plz tell me how can i do it with css or java or php ?

 

http://www.w3schools.com/css/css_image_transparency.asp

this link will really help you.

thanks

 

Thanks Jack456, i think your link wil really help.
Hope some other guys will also give other cool suggestions...

 

With CSS you can set images so that the image transparency changes when the mouse hovers over it. However this will be an instant change say from 100% to 50% opacity or whatever you specify.
So you can't fade in or fade out slowly with CSS it would be an instant change on hover.

If you want a fancy fade in or other effects then your best bet is probably to use a JavaScript library, like JQuery and then Google how to add these effects I guess.

However you should ask yourself whether it's worth adding the JavaScript or not.

 

I have already visited jquery but didnt understand how to use it in 4images so if you plz explain it or give any other javascript link it will be nice.
Thanks