[DEMO] DD_belatedPNG(Javascriptライブラリ)[詳細]

DD_belatedPNGのテストです。これはIE6向けの透過PNGを手軽に扱うJavascriptライブラリです。
そのため、このスクリプトは条件付きコメントを使ってIE6以下だけに読み込ませています。

このスクリプト、通常の画像(imgタグ)とCSSの背景双方に適用できます。
適用方法は以下のようにCSSセレクタと同じように指定します。
「DD_belatedPNG.fix( '#sampleImg, #pngTestBox02');」
CSSセレクタと同様、カンマ区切りで複数指定できます。

しかしながら、このライブラリを使う際には注意点があります。
CSSの背景にPNG画像を指定した場合は問題ありませんが、
img要素に(つまり通常の画像として)指定した場合、いくつかのライブラリで実装する、
フェードアウトやフェードインの視覚的効果が実行されません。
推測では、filter 機能が使えないために透明度が変更できないのだと思います。
なので、もしこのライブラリを使う場合はCSSの背景として使うのが無難です。

サンプルPNG画像

↑ img要素によって読み込まれたPNG画像です。

 

↑ div要素の背景に、CSSによって読み込まれたPNG画像です。