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.
Leave a Reply