1

Drew Dillard の素晴らしい DD_belatedPNG 修正 + jQuery を使用して、ホバー時にありふれた画像交換を実現しようとしていますが、PNG を使用し、IE6 で動作するようにしています。

例：<a id="thelink" href="blah.html"><img src="f-u-ie6.png" /></a>

DD のスクリプトは元の画像の可視性を「非表示」に設定するため、効果的にカーソルを合わせることができません。私が気付いたのは、多くの人がこの制限によって妨害されていることです。Drew が、PNG 修正の次のバージョンで回避策を見つけようとしていると述べたほどです。

それまでの間、代わりにイメージの親でホバー イベントを処理することで、これを回避できると考えました。そのため、onmouseover で DD_belatedPNG によって作成された VML オブジェクトを非表示にし、「thelink」に背景画像を設定し、onmouseout で VML オブジェクトを再度表示し、背景画像を何も設定しません。

次のコードは、VML オブジェクトにアクセスできるかどうかを確認するためのものですが、VML では機能しません。他のすべての子を隠しますが、VML は隠しません。何か案は？

$(document).ready(function(){
  $("thelink").hover(function() {
    $(this).children().attr({ 
      style: "visibility:hidden"
    });
  }, function() {
    $(this).children().attr({ 
      style: "visibility:visible"
    });
  });
});

あるいは、素晴らしい PNG 画像交換方法を提案できる人はいますか? リンクの背景画像を交換できることは知っています。ただし、A タグ内に何かを含める必要があります。それは私の場合ではありません。また、透明な GIF を A タグに入れ、背景画像を交換して効果を実現することもできますが、私は実際にはそうしたくありません。あなたの洞察に感謝します！

4

1 に答える 1

0

innerHTML を見て (ブラウザーのアドレス バーで JavaScript を使用)、DD_belatedPNG修正を使用したときに PNG を表示する VML オブジェクトを生成するコードを確認した後、別の手法を取ることにしました。

現在、TwinHelix の IE PNG Fixを使用しています。A タグに OFF 状態と ON 状態の両方の PNG がありますが、ON 状態の画像は に設定されていdisplay: noneます。これらの画像を切り替えるために jQuery を使用しています。特定のコードについては、他の投稿を参照してください。

これはすべて、PNG ロールオーバーが IE6 で動作することを確認するためのものです。

于 2009-10-21T20:58:06.920 に答える