グラビカ学習帳～四谷のホームページ制作会社 gravity works（グラビティ・ワークス）備忘録と知識の共有と蓄積

JavaScript（jQuery）を使って画像をフェードさせていたところ、
フェード中のいくつかの画像に白い点々が出ているのを見つけました。
（ディスプレイのドット落ちのような・・）

調べてみたところIEのバグのようです。
いろいろな方の記事で書かれているのを見ると、
発生条件は以下のような感じ。

・JavaScript の filter:alpha(opacity); を使用
・JPEG画像を使用
・#02050a の色を使用

要するに、#02050a を含むJPEG画像をJSで透過させると、
#02050a の箇所だけが完全に透過JPEGになってしまう、
というバグのようです。IEのみ。

解決策としては

1. PNG画像などにする
2. #02050a を使わない
3. 背景色を #02050a にする

となりますが、
何故かPNG画像にしただけでは直らず・・
結局、PNG画像 ＋ #02050a の部分を別の色で塗りつぶすことで
解決しました。

ちなみにIE6の頃からあったようですが、IE8でも確認しました。。