Neat Photo Hover Effect with CSS Sprites and jQuery

Wednesday, September 22, 2010

Here is a very nice effect for photos or some black and white images. We are using some CSS sprites for the photos to create a darken effect when hovering over the images. This could also be used with other effects. The basic principle is to create the impression that the background gets darker when hovering.
The CSS sprites image of each photo gets first loaded in the photo container. Then we add a paragraph element which has the same background image but a different background position (the dark half). This element gets faded in, so we have a smooth effect.

Click here for Demo

Click here for Download

0 comments:

Post a Comment

 
This is Sakthi, CSS Developer @ Chennai,India © 2010 | Designed by My Blogger Themes | Blogger Template by Blog Zone