Change Color of PNG Image on hover?

I added th开发者_如何学Goese icons http://grab.by/9HYW to my site and wanted to change the color on hover...what is the best solution?

The icons are in png format and would like to change on hover to their blue colors...thanks in advance.

You should generate new blue images with your editor (the one that you've created the first icons), then you use css hover.

You can use a css sprite (arguably the cleanest and most cross-browser comparable way) in which you basically have both the regular and hover state in one image and change the background-position of the div on hover. (xpixelz links should help you.)

If the images are actually printed on the page, you can use javascript to swipe the image with the hover state on hover.

I'm not sure how they are displayed on the page, but if they are on a solid colored background, you could make a png of the negative space and place it inside a div of the exact width and height of the image then just change the background color of the div on hover, since the actual logo is transparent you would see the background color of the parent div.

as you may opt for CSS sprites http://css-tricks.com/css-sprites/ google for "css sprites generator" if you need a quick way ;)

If you are using flat png icons then you can use jFlat jquery plugin. Remember it only supports for HTML5 supported browsers

source : http://flaticon.sodhanalibrary.com/jFlat.html