IE6では透過PNGが透過しない。それを無理やり透過させてしまうJavaScriptライブラリを調べたメモ。
- DD_belatedPNG
- 配布元：DD_belatedPNG: Medicine for your IE6/PNG headache!
- 使い方：ITキヲスク | IE6用透過png対応策、DD_belatedPNGの使用法と注意点
- 注意点：
- PNG画像のURLが「.png」で終わる画像のみが対象。それ以外に適用したい場合、「.search(/\.png$/)」のところを変更すればOK
//例：Railsによる更新タイムスタンプ付与への対応
.search(/\.png$/) → .search(/\.png(\?[0-9]+)?$/)
- CSSで該当要素に「!important」を使っている場合、そちらが優先されてしまうので透過が適用されない
- CSSのclass
- body要素、tr要素、td要素には適用できない（thは？）
- 「background-position: fixed」にも未対応
- input要素の「type="image"」も未対応
- ライセンス：MITライセンス
- その他：
- 他のライブラリで使われている「AlphaImageLoader」を使わずに、代わりに「VML」を使うことにより処理が速いらしい
- 生ソースを見た感じだと、DD_belatedPNG.fix(<CSS Selectors>)を使うよりもDD_belatedPNG.fixPng(<HTML Element>)を使った方が速そう（体感できるかは分からないが。）
- 参考：IE6で透過PNGを手軽に使えるJavascriptライブラリ「DD_belatedPNG」 | CSS-EBLOG
- uupaa-suketranse.js
- 配布元：uupaa-js-spinoff - Project Hosting on Google Code
- サンプルページ：uupaa.js spin-off project uupaa-suketrans.js - test
- 注意点：
- PNG画像のURLについては、上記のDD_belatedPNGと同じ
- !importantについても同じだと思う
- ライセンス：MITライセンス
- IE PNG Fix
- 配布元：IE PNG Fix - TwinHelix
- 注意点：htcを使っている
- ライセンス：LGPL
- その他：
- バージョン2からはrepeatに対応したらしい（参考：IE PNG Fix Alpha 2を使ってみた。 | ちぷろぐ）
- 未試用
- 参考：IE PNG FIX 2 (iFFALSE.log | takuyaな日々 ver.2)
DD_belatedPNGが一番良さそうかな？
参考：
ITキヲスク | IE6で透過pngを表示させるオススメscript、「DD_belatedPNG.js」
投稿
0 件のコメント:
コメントを投稿