先日、フォトギャラリー風なページを作成してブラウザチェックを行っていたときに、IEのみ画像が透過になった現象が起きました。

最初はモニターが壊れたのかと思ったのですが、どうやら「filter:alpha(opacity);」を使用すると、画像内の#02050aが使用されている箇所が表示されなくなるバグみたいです。解決方法はpngで書き出す、#02050aを使用しない、画像背景にうまいこと#02050aを指定するみたいなことが考えられました。

この中で選んだ作業は#02050aを使用しないということだったのですが、これがまた大変な作業でした。photoshopを使用して、使用している画像を一つ一つチェック、修正の繰り返しで…画像が100枚強あったので途中何度も萎えましたが何とか終わらせることができました。本当ならばpngで処理したかったですが。

偶然出くわしたバグなのですが、とてもいい勉強になりました。