3

以下の2つの画像があります。

それらは同じ画像ですが、テキストにわずかなグロー効果があります。

それらは以下のように設定されます：

<div id="header"><a></a></div> 元の画像がdivの背景であり、「glow」画像がアンカータグの背景です。display:block; width: 100%; height: 100%;opacity: 0;

私は以下のjqueryコードを使用しています

$('#header a').hover(
  function() {$(this).animate({"opacity":"1"}, 1000);},
  function() {$(this).animate({"opacity":"0"}, 1000);});

ホバー時にアンカー画像をフェードインおよびフェードアウトします。

これはFirefox、Chromeなどで正常に機能します。ただし、Internet Explorerでは、透明度のある黒一色の背景が画像に表示されます。

どうすればこれを修正できますか？

注意：私が心配しているのは、6ではなくie7/8だけです。

http://webspirited.com/header-reachsniper.png http://webspirited.com/header-reachsniper-hover.png

更新
これは、InternetExplorerで行う時間の価値がないことを確認しました。

ただし、これはie9で完全に機能するため、ie9未満のブラウザーではこの効果を取り除くことができないと思います。

4

2 に答える 2

2

透明なPNG画像の不透明度を設定するには、IE8でもAlphaImageLoaderフィルターを使用する必要があります。

編集alpha： CSSに次のようにフィルターを追加する必要もあります：

filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src="path", sizingMethod="scale"),alpha(opacity=100);

それ以外の場合、jQUeryはフィルターを追加するときに既存のフィルターをクリアしalphaます。

于 2010-08-24T00:57:52.827 に答える
0

Dave Sheaのmezzoblue.comからのこの投稿は、あなたを助けるかもしれません：http: //mezzoblue.com/archives/2010/05/20/ie8_still_fa/

それは彼が試みたすべての方法と彼が最後に到達した最終的な解決策を記しています。

動作したのは、AlphaImageLoaderの代わりにVMLを介してPNG透過性を適用するDD_belatedPNGと呼ばれる小さなライブラリでした。IE6用に設計されていますが、IE7でも問題なく動作します。IE8の場合、この特定のページでは、X-UA互換のメタタグを破棄し、IE8をIE7モードにステップダウンする必要がありました。

最後に小さな警告があります

それはまだ完璧ではありません。IEのすべてのバージョンで、ホバー効果をわずかに調整しなければならない、低い不透明度で突き抜けているかすかな白いバウンディングボックスに気づきました。しかし、あなたは知っています、それでも、それは十分に良いことです。

于 2010-08-24T11:58:02.023 に答える