IE6で透過pngを表示できる「DD_belatedPNG.js」
IE6で透過pngを実現してくれる相棒のお話。
まえがき
昔、私がどんなにいろんな事(AlphaImageLoaderとかiepngfix.jsとかie7.jsとか)試しても
IE6に透過pngを表示させることができなかった時期がありました。(本当に原因不明w)
そこから私を救ってくれたのが
「DD_belatedPNG.js」
というjavascriptです。
img要素だろうが背景だろうが全部透過pngで表示してくれます。
IE6で透過pngなんてかなり今更感がありますが
リスペクトの意をこめて、慎ましくエントリーさせていただきます。
DD_belatedPNG.jsの使い方
まず、本体をダウンロードします。
作者様サイト
↑のリンクを開くとコードがでてくると思うので、コード全部コピーしてメモ帳かなんかに貼り付けます。
ファイル名を「DD_belatedPNG.js」にして保存します。
使い方は簡単。
htmlの<head>~</head>内に
<!--[if IE 6]> <script type="text/javascript" src="jsまでのパス/DD_belatedPNG.js"></script> <script type="text/javascript"> DD_belatedPNG.fix('img, .png_bg'); </script> <![endif]-->
「<!–[if IE 6]>」~「<[endif]>」はIE6だけに読み込ませるタグです。
DD_belatedPNG.fix('img, .png_bg');
これは透過pngを有効にする範囲の設定です。
この場合、「img」タグ全部と「png_bg」と付いたクラスの背景に適用されます。
背景を透過pngで表示したい場合、
背景を指定している「div」かなにかに「class=”png_bg”」をつけてあげればいいということですニャー。
あとがき
KoToRiは思います。
日本で未だにIE6を使っている方は、世のWebデザイナーのために今すぐ爆発してください。キラッ☆