View Full Version : Who supports PNG opacity?
TheJoshMan
11-24-2006, 10:48 PM
Hey I was using a PNG at 50% opacity as the background for a floating div... well, it looks fine on my desktop... but when i view it on my laptop it's a plain white background... is there any reason for this? Both use IE, desktop uses latest version, laptop uses older version... this made me wonder... are there other browsers that don't support this form of tranlucency? Can this be "worked around"? Is there another way to code it to make it work? I'm trying to accomplish it with strictly css... somebody told me about something like "filter:progid:microsoft" blah blah blah... I don't know exactly how to implement such code. Any help would be greatly appreciated. Thanks.
Yes, IE<7 doesn't support PNG alpha transparency. To make it work in IE6, you must apply:
filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='/path/to/image.png');to the element.
TheJoshMan
11-25-2006, 03:34 AM
Ok, so it worked on ONE of the images I was using but it was a full sized image not being used as a background image... The other is a 4x4px background image... and I can't get it to work on that one... Here is the code I'm using...
.trans_div {
width: 164px;
height: 107px;
position: absolute;
left: 650px;
top: 173px;
font-weight:bold;
padding:1px;
border:solid 1px bcac75;
overflow:auto;
background:url('http://www.waldronar.com/Design/Myspace/Tech-Grunge-Overlay/images/50-Percent.png');
background-repeat:repeat;
filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='http://www.waldronar.com/Design/Myspace/Tech-Grunge-Overlay/images/50-Percent.png');
}
<div class="trans_div">
<center>
<a href="http://en.wikipedia.org/wiki/Epitome"><em><font size="1" color="bcac75">Epitome</em></a> of my <a href="http://en.wikipedia.org/wiki/Narcissism"><font size="1" color="bcac75">Narcissism</a>...<br style="clear:both;">
<a href="http://hotornot.com/r/?eid=AYBREMR-ARA">
<img src="http://pix2.hotornot.com/s/AYBREMR-ARA.jpg" class="hot">
<br style="clear:both;">
<font face="verdana" size="1" color="bcac75">www.hotor<em>not</em>.com</a></center>
</div>
Try using sizingMethod=crop on that filter as well.
TheJoshMan
11-26-2006, 08:53 AM
Thanks... That worked. I appreciate the help.
Powered by vBulletin® Version 4.2.2 Copyright © 2021 vBulletin Solutions, Inc. All rights reserved.