古いIEプラウザで透過PNGを適応させたい。

表示できない、レイアウトが崩れる、透過できないetc,etc...
そんな困ったIEの対応策を書き綴っていきます。

• PNGの透過部分が透き通らない。
  • DD_belatedPNG.jsを使用する。
    http://www.dillerdesign.com/experiment/DD_belatedPNG/よりDLした0.0.8a-min.jsファイルをhead部に下記のように記述する。

<!--[if IE 6]>
<script src="js/DD_belatedPNG.js"type="text/javascript"></script>
<script>DD_belatedPNG.fix('img, .png_bg');</script>
<![endif]-->

コードの説明

1. 1行目と6行目でIE6プラウザで閲覧した時だけスクリプトを発動すると宣言する。
2. 先ほどDLしたDD_belatedPNG.jsを外部ファイルとして読込み
3. '.png_bg'の部分にDD_belatedPNG.jsの効果を反映する要素名、id,class名を当てる。上記の記述だと「img.クラス名」で設定されている。

DD_belatedPNG.jsの指定範囲にはGoogleMapが表示されません。

IEプラウザの表示内容をプレビューしてみる。

• Sauce
  • IEを含めた様々なプラウザに加え、それらをOS別（Win各Ver,Linux,iOsなど）で閲覧した場合の表示を確認できる。