title: Cross browser rgba transparent background while keeping content (text & images) non-transparent
body: <p>I want to get rgba backgrounds working with all browsers. I did some searching and found out that generally there are three types of browsers out there:</p>
  
  <p>1) Browsers that support rgba.</p>
  
  <p>2) Internet Explorer that supports rgba via bizarre '-ms-filter' thing.</p>
  
  <p>3) Browsers that do not support rgba, but I could use base64 png images with 'data URI scheme'. (Even when browser does not support URI scheme, according to <a href="http://www.phpied.com/mhtml-when-you-need-data-uris-in-ie7-and-under/" rel="nofollow">this</a> it still could be done.)</p>
  
  <p>I have no problems with rgba supporting browsers, and I can get it working with IE, but problem is that I have no idea how to generate client side base64 png images for URI scheme. I really do not want to pregenerate png files, because my rgba values are not constant. I could go with dynamic png generation with php gd library, but I'd really like to do all this on client side. So I'd like to know, is there any good way out there for generating semi-transparent png images with java-script. After this I could just base64 encode them and use them with URI scheme?</p>
  
  <p>Thank you.</p>
  
  <p>Edit:</p>
  
  <p>I want to have semi-transparent div background, while having content fully visible.</p>