Archive for August, 2012

Make Gray image using css (Support all major browsers even IE 7,8,9)

One of my project , i have to make all images gray onload and make it color when mouse hover on image.

There are a lot of solution in web using jquery, html5 but i would suggest to do it through CSS so that it will support all browsers even IE all lower version.

Solution:

/** WORKING FOR GRAY IMAGE AND HOVER */
.grey img{
opacity: 1;
}
.grey img {
filter: gray; /* IE6-9 */
-webkit-transition: opacity 0.3s;
-moz-transition: opacity 0.3s;
}
.grey img:hover {
filter: none;
}

/** Gray image css finish */

Advertisements

1 Comment

last-child selector support in IE8

people might like to use last-child selector in css for styling the content like menu or list.

but it dont support IE 9 lower version.  I have pretty nifty solution of it. Follow the link

http://css-plus.com/2011/03/prevent-last-child-from-slowing-you-down/

It just change the selector to first-child and got the same result .-)))

Leave a comment