IE6にてpngを透過させる IEPNGFIX
ブラウザ(IE6)により、PNG24を使用した時の透過具合が違う。
そんな時に使えるIEPNGFIXの覚書。
サイトからDownload内にあるiepngfix.zipをダウンロード後、フォルダの解凍を行う。
解凍したフォルダにある、iepngfix_tilebg.jsとiepngfix.htcを任意のフォルダにFTPなどを使用しアップロードする。
<head>~</head>内に記載
<script src="/iepngfix_tilebg.js" type="text/javascript"></script>
アップロードした、iepngfix_tilebg.jsまでのパスを記入します。
CSS
behavior: url(http://~~~~~/iepngfix.htc)
CSSへ先ほどアップした、iepngfix.htcまでのパスを記入
CSSで使用する場合
CSS 例
h3.iepngfix { background: url(http://~~~~~/h1.png) no-repeat; width: 200px; height: 100px; margin: 0px; padding: 0px; text-indent: -9999px; behavior: url(http://~~~~~/iepngfix.htc) }
CSS 例 HTML 記述
<h3 class="iepngfix">インベントリー</h3>
imgで使用する場合
img 例
img.iepngfix { behavior: url(http://~~~~~/iepngfix.htc) }
img 例 HTML記述
<img src="パス" width="100" height="100" alt="" class="iepngfix" />
以上の作業でIE6でもpng24を透過させて表示することが可能です。