alphafilter.jsが透過pngのロールオーバーに対応

IE6用の透過pngライブラリ「alphafilter.js」が透過pngのロールオーバーに対応しました。

透過機能はIE6で画像の拡張子がpngの場合のみですが、ロールオーバーはすべてのブラウザ、jpg、gif、png形式の画像で利用いただけます。

img要素の場合class属性に「btn」と付ければロールオーバーの処理を行います。

<img src="./sample.png" class="btn" alt="" />

sample.pngの場合はsample_on.pngのように拡張子の前に「_on」が付いた画像をロールオーバー時に表示します。

透過機能と合わせて利用する場合は、以下のように指定します。

<img src="./sample.png" class="alphafilter btn" alt="" />

シンプルなライブラリでいようと心がけていたのですが、透過png+ロールオーバーは個人的に非常にニーズの高い機能なので実装してみました。

関連エントリー

FirefoxとOperaでword-break:break-allを実現する「wordBreak.js」
footerをウィンドウ下部に固定する『footerFixed.js』
ブロックレベル要素の高さを揃えるheightLine.js
ページ内リンクをスマートにするsmoothScroll.js
一番簡単な画像置換の方法-imageReplace.js-

スポンサードリンク

«現場のプロから学ぶXHTML+CSS 増刷(6刷)決定 | メイン | ゼロからはじめるPHP入門講座 [東京]»