Prevent white noise from appearing in images after fading
Heads up! This post was written in 2009, so it may contain information that is no longer accurate. I keep posts like this around for historical purposes and to prevent link rot, so please keep this in mind as you're reading.
The first time I ever saw this alleged bug was in Internet Explorer 7 yesterday. Images were rotating on a page in the form of a slideshow, fading in and out for a nice, smooth transition. One problem, though: in Internet Explorer 7 (and 6, as it turned out), one of the images would appear with a small cluster of white pixels around the black areas.
To make sure the image wasn't corrupt, I saved it again using PhotoShop. No luck. Even after saving the image as a GIF instead of a JPEG, the white noise persisted in IE.
Luckily, some research resulted in finding Alex Judd's post, which provided a relatively simple solution to the problem.
Evidently, IE mistakes some of the true-black pixels for transparent pixels, which causes the "white" noise (which may not necessarily be white, depending on the underlying background). One work around, as Alex points out, is to adjust the levels of the image in Photoshop very slightly—just enough to eliminate the true-black pixels.
To do this, open the image up in PhotoShop and perform the following steps:
- Move the
Output Levelsslider a few pixels to the right (or type in a small number, like 5)
- Save the image
In most cases, there won't be a noticeable difference in color. Alas, this work around does solve the display problem in IE, but not without tampering with the original image. We'll have to keep our fingers crossed in that IE8 finally addresses this issue.