How to Create Transparent/Faded Image or Div

Its been quite a wish for a lot to fade or make an image or div transparent just with the CSS code, and it was quite just a thought, which is actually now possible.

Though its not a standard CSS code, but W3C CSS3 recommended one, which do work in most of the major new browsers.

The CSS code,

opacity: 0.7
filter: alpha(opacity=70); /*for Internet Explorer*/
-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=70)"; /*for IE8 and IE9*/
-moz-opacity: 0.7; /*for Mozilla Firefox*/
-khtml-opacity: 0.7; /*for Safari Browser*/

Can be used for images or div

Also can be customized to be used during mouse over actions!

<img onmouseover="this.style.opacity=1;this.filters.alpha.opacity=100" onmouseout="this.style.opacity=0.4;this.filters.alpha.opacity=40" style="opacity:0.4;filter:alpha(opacity=40)" />

You can Download this test file here, and see how it works practically.

Got any issues or conflicts, just leave a comment, and lets sort it out.