透過PNGをIE6以下で表示させる方法

透過PNGを使う方法なんですが、いろいろ紹介されているんですが、自分が検証してみた所。
何かと問題が起こったりするのもあるんですよね...

でも[to-R]さんで紹介している。alphafilter.jsはそういう挙動が自分がやっている範囲では起こっていないので紹介しておきたいと思います。

…ここからが続き

alphafilter.jsの使い方

まずはhead要素内にalphafilter.jsで読み込みます。
※読み込みを高速化させるためdefer属性をの記述を忘れずに行ってください。

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

透過にしたい画像にclass属性でalphafilterと入れるだけでです。

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

背景に透過pngを使う場合は背景に設定しているブロックレベル要素のclass属性にalphafilterを入れるだけです。

<div class="alphafilter">
<p>内容</p>
</div>

これを考えてくれた[to-R]の西畑一馬さんに感謝です。
ダウンロードは本家サイトからお願い致します。

Comment Form

※コメントが認証されるまで、コメントは反映されません。ご了承くださいませ。


(公開されません)
 
Captcha

画像の中に見える文字を入力してください。

page top へ

Sponsor

  • heteml
  • Movable Type

Category

Recent Article

2011 04-05
iPhone スマートフォンサイトのデザインのまとめ
2011 04-04
スマートフォン対応にしてみました
2011 04-01
CSS3 要素を透明に出来る Opacity と RGBa の使い方
2011 03-31
サイトリニューアルしました
2010 12-01
CSS3 でボタンを作る為のテクニック、サンプル集
2010 11-24
綺麗でリッチなフッターデザイン集のまとめ 60
2010 11-18
緑と黒色を使った Webデザインのサイト 25
2010 11-10
知っておいた方が便利なエクセルの知識

Recent Comments

Archive

2011年
2010年
2009年
2008年

Related Article