Forum Moderators: open

Message Too Old, No Replies

IE JPEG transparency, it seems?!

never seen IE act this weird before...

         

onionringofdoom

9:06 pm on Jun 10, 2005 (gmt 0)

10+ Year Member



I have 4 images set up in a horizontal row, each image is ontop of a div with a certain background color. Now, when the image is rolled over, I've used css opacity and the alpha filter for IE to make the image be transparent, and thus alter it's color to be closer to what the background color of the div is.

So what happened was I recently all these images in the gif format, and I decided to switch them to the jpeg format, given that they were photos. Now, I used the "save for web" feature in Adobe Photoshop CS, and when I went to refresh my page in IE, it seems that whenever I roll over an image, some select pixels of it are 100% transparent, not the 25% that the rest of the image is. After some fiddling around in photoshop, it seems that these pixels weren't only the PURE black ones, like I had thought. However, all that were being selectivly set as 100% transparency were all the same color (RGB value of 2,5,10). I changed these pixels to pure black, and it fixed some of them, but some were still 100% transparent.

I've looked at microsoft's page on the alpha filter, and nothing in it tells about color gamut problems. I've honestly never seen anything like this, and I shall continue to fiddle with it. Perhaps it could be controlled and exploited for some nifty graphic effects?

Dijkgraaf

9:54 am on Jun 11, 2005 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



JPEG is what is called a lossy format. What this means is then when it compresses an image it loses some information (and quality) to achieve the compression and therefore some pixels will slightly change in colour. This especially occurs in the darker areas as the eye sees less details in darker areas, so this is where most of the compression occurs.
These changes occur every time you save a JPEG, so if you open a JPEG and save it again, it will again slightly change some of the pixels.
So if you want to create transparencies based on colours, use a non lossy format like PNG (or GIFs like you had originally).