0

透明度のあるPNGでjQueryのfadeIn（）関数を使用すると、アニメーションの期間中、IE7/8で透明度が無効になることがわかりました。私の調査によると、これは、特定の要素でアクティブにできる「フィルター」は 1 つだけであり、透明度と不透明度の両方がフィルターと見なされるためです。

SOと他の場所の両方で、これに対するいくつかの想定される解決策を見てきましたが、どれも成功していません。画像を別の要素でラップして、その要素をフェードするなどのことを試しました。画像を背景画像にしてみました。この問題に対処するためのテスト済み/確認済みのソリューションまたはベスト プラクティスはありますか? ブラウザーのスニッフィングを実行して、代わりに IE の show() を使用できると思っていましたが、可能であればフェードを機能させたいと考えています。

4

1 に答える 1

0

私がよく耳にする修正 (自分で試したことはありませんが) は、png 画像を保持する親コンテナーをフェードすることです。画像の周りに ID (またはクラス) を持つラッパー div を追加し、それをフェードするだけです。

<div id="wrapper">
  <img src="image.png" />
</div>

それでもうまくいかない場合は、画像を透明な背景画像として設定し、ラッパーをフェードさせることができます。

<div id="wrapper">
  <div id="image">
  </div>
</div>


#image
{
  width:100%;
  height:100%;
  background:transparent url('image.png') no-repeat;

  /* css For IE background image*/
  background:none\9;
  filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src="image.png", sizingMethod="crop");
}

注: IE アドレスの背景の後の「\9」は、IE8 以下のみを対象としています。

それでもうまくいかない場合は、png を png8 (png24 ではなく) としてレンダリングしてみてください。

于 2012-11-29T20:13:33.030 に答える