最近は透過pngを上手に使ったサイトも増えてきたので、IE6を気にせずに、透過pngを普通に使って、サイトを作りたいと思ってたのですが、IE6の使用率がゼロでない以上は、やっぱり気になってしまうので、お手軽な方法を調べていたら、詳しくまとめられているサイトを見つけたので、メモしておきます。
個人的に特に気になったのは、「ie7.js」と「DD_belatedPNG.js」です。他の方法は既知のも…
DD_belatedPNG
先日、でも触れましたが、DD_belatedPNGというjavascriptを使って、IE6で透過pngを表示させてみました。DD_belatedPNGの入手

以下のサイトにいって、DD_belatedPNGをダウンロードします。以下のサイト内を下へスクロールしていくと、左のサイドバーにDD_belatedPNG 0.0.8a releasedというリンクがありますので、そこをクリックします。
DD_belatedPNGの設置方法
ダウンロードしたファイルをサーバにアップして、以下のコードをhtmlファイルに設置します。<!-- IE6を透過png対応させる --> <!--[if IE 6]> <script type="text/javascript" src="js/DD_belatedPNG_0.0.8a-min.js"></script> <script> DD_belatedPNG.fix('img, .wrap980 h1 a'); </script> <![endif]-->
「if IE…」というのは、IE6の場合に以下のスクリプトを読み込む設定です。
上記のコードでは、imgタグ全てと、wrap980クラス内のh1のaタグが指定されています。
後者はサイトロゴの背景にpng画像を設置していたので、こういう書き方にしています。
普通に配置されているimg画像やCSSで背景に画像が設置されている場合は、上記のやり方で問題ありませんが、body・tr・td要素の背景には使えないなど、いくつか注意する点もあるようなので、もう少し情報が必要な方は以下のページが詳しく説明してくれていますので、参考にしてみてください。
この投稿へのコメント
コメントはまだありません。