01/08
IE7:filterを使用するとフォントのアンチエイリアスが無効になるタイトルのままなのですが、
これまた遭遇確率の低い地味な現象なので備忘録として。
IEの独自拡張として用意されているfilterですが、Web制作時には
おもに透明度(opacityとか-moz-opacity)のクロスブラウザ対策として
使用することが比較的多いかと思います。
その際、IE7でこのfilterを指定すると指定された要素内のテキストの
アンチエイリアスが無効になるようです。
ただ、実際にはアンチエイリアスが無効というのは
少々語弊があるのかもしれません。
ためしに、
screen.fontSmoothingEnabled
を使用してアンチエイリアスの状態を監視すると、常に"true"を
返してきますので、アンチエイリアスは有効な指定状態なんだけど
ブラウザ上に正しく描画できていないという感じなのだと思われます。
まぁ、バグですね。
また、厄介なのが
style.filter = null
でも現象が再現するようですので、フェードインして表示させるような
スクリプトを書かれている場合は、フェードインした後
(完全に不透明になった状態)で
style.removeAttribute('filter');
って感じで、filter指定ごと削除してやればまだ何とか
マシな感じなりますが、透明度を維持させないといけない場合は
現状では回避するすべはないかと思われます。
MS ゴシックなどを指定している場合にはアンチエイリアスが
利いていなくてもそれほど違和感はありませんので、あえて
screen.fontSmoothingEnabled
に"false"を指定してアンチエイリアスをもともと
無効にしておいてやるのも手かもしれませんが、
メイリオを指定している場合はフォントサイズによっては著しく
劣化しますので、次期IE8ではこのあたりの対応が望まれますね。
コメント(0)