0

現在、マウスがさまざまな div の上に置かれたときに、複数の fadeIn() および fadeOut() イベントが発生しています。フェードイン div 内のテキストは、fadeIn イベントが終了するまで実際にピクセル化されたように見えますが、その後、滑らかな外観のテキストに「ポップ」します。

実際にフェードインする前にdivにフォントを滑らかにするように指示することは可能ですか、それともdivを画像にすることによってのみこの効果を達成できますか?

http://www.daemondeveloper.comでベン図のホバーを確認してください。

4

1 に答える 1

3

これは以前はより広い問題でしたが、それでもIEの問題です。これを回避するためにできることがいくつかあります。まず、フェード要素に背景があることを確認します。

より大きな問題は、IEが不透明度フィルターを介してテキストレンダリングをレンダリングする方法です。明らかなアンチエイリアシングに加えて、文字の形も実際にはかなり変化する可能性があります。解決策は、IEの不透明度フィルターを99%で要素に事前に適用することです。これは本質的に不透明ですが、jQueryエフェクト中に要素が一貫してレンダリングされるようにします。

Ivanのjsfiddleに基づいて構築されており、これはテキストのフェードに対する背景の影響を示しています(IE8でテスト済み):http://jsfiddle.net/joemaller/WLjXW/

重要なのは、次のようなcssルールです。

#sometext {
  background: #fff;
  -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=99)";
  filter: alpha(opacity=99);
}

同様の質問: つまり、テキストのフェードの問題
IEの不透明度ルールの詳細:http ://www.quirksmode.org/css/opacity.html

于 2012-07-10T19:54:40.507 に答える