Today’s market is based on 3D and most things are doing by jQuery or Javascript to make fast loading application. Opacity is a part of CSS to make transparent image without PNG format. To set the opacity property to an image you can use:
.img_transparent_class{ opacity: 0.5; } |
But this line will suitable for some latest browsers and it will not show effects in some browsers like IE 7 and IE8, etc.
To apply in all browsers you can follow:
.img_transparent_class { /* IE 8 */ -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=50)"; /* IE 5-7 */ filter: alpha(opacity=50); /* Netscape */ -moz-opacity: 0.5; /* Safari 1.x */ -khtml-opacity: 0.5; /* Good browsers */ opacity: 0.5; } |
Above code will transparent the image in all browsers but there is an another conditions that you have to follow order. Means “-ms-filter” property should be write before “filter” property.
That’s it.
