■透過pngに関して参考にしたサイト
http://blog.l-xs.com/yungsang/2007/02/png_ie_ie7.html
■javascript
<script type="text/javascript" src="iepngfix.js"></script>
■css
#test {
position: absolute;
top: 10px;
left: 100px;
width: 100px;
height: 100px;
background: url(test.png);
}
* html #test {
behavior: expression(IEPNGFIX.fix(this));
}
■xhtml
<div id="test"><a href="http://www.hatena.ne.jp/">リンク</a></div>
※リンク箇所に関してpositionをrelativeに設定するとリンクがきくといった内容もありましたが、うまくいきませんでした。
Photoshopで作成した透過型PNG画像を使い、手持ちの WindowsXP(SP3) + IE7 では正常にリンクを押下できました。
気になった点を2点ほど――。
回答ありがとうございました。
リンク先の内容を確認したところ「IE6」は透過pngを使わずに別対応するという内容でした。
今回の私の件に関しては「IE6」でも透過pngを利用するところまではきているのですが、background且つposition: absolute;の場合、背景の上に重なっているリンクが機能しないことに対する対応策が知りたいです。
http://www.yomotsu.net/wp/?p=400
ここによると、position に absolute または relative が指定されている要素に
AlphaImageLoader を使うと、その子要素の a 要素や onclick,onmouseover などが
絶対に効かなくなるということらしいです。
透過pngをやめるか、positon:absoluteをやめるか、あるいはflashなどで作成するしかないようです。
すみません、一点肝心な説明が抜けていました。IE7やfirefox等では問題ありません。
IE6でリンクが押せなくなります。