以前書いた「[Cording] IE6用に透過pngを使用する場所によってのタイプ別JS Vol.1」の第2弾です。
今回はナビゲーションで透過pngを使いたい場合。絶対必要なロールオーバー表現を可能にするJSです。
とはいえ、あまりに有名なJSなのでご了承をば。

アルファ画像を扱うalphafilter.jsライブラリ
これです。
他にも数々あれど、ロールオーバーをこんなに簡単に作れるものを私は探せませんでしたよ。作者さまありがとうございます。
使い方は本家サイト見てもらった方が早いのですが、
まずは

<script type="text/javascript" defer="defer" src="js/alphafilter.js"></script>

を読み込みます。
このとき必要なのがdefer="defer" これを忘れるとうまくいきません。
そのあと必要なことが、
透過pngを使いたいタグやimgにclass="alphafilter"をつけてあげること。
ロールオーバー表現をCSSで作る場合はそれ用のclassを作っていると思うので、それを
class="alphafilter btn"
みたいにして指定してあげればOK。
ちなみに、
ロールオーバー表現は2009/5に追加されていたんですね。
本当に感謝です!

タグ:, , , ,

関連する投稿