真・PNG・完結編・2『Windows IE 6 では、「半透明 + 透過 PNG」を background プロパティに指定することは出来ない。』というのが、2006年1...2007年5月28日 1時10分 PNG・完結編(覚書)ふと、PNG関連記事を読み直していたら、他の人にはあまり参考にならんな、と気付いた(w自分でも訳が分からなくなっている部分を、できるだけ簡潔に纏めてみ...2006年1月28日 5時58分
真・PNG・完結編・2『Windows IE 6 では、「半透明 + 透過 PNG」を background プロパティに指定することは出来ない。』というのが、2006年1...2007年5月28日 1時10分 PNG・完結編(覚書)ふと、PNG関連記事を読み直していたら、他の人にはあまり参考にならんな、と気付いた(w自分でも訳が分からなくなっている部分を、できるだけ簡潔に纏めてみ...2006年1月28日 5時58分
[ SiteTop← ] 半透明を表現できるアルファチャンネル付きのPNG画像(αPNG)の作り方を紹介します。作り方と言っても、私の環境(Windows)に依存した一方法に過ぎません。ましてや、最良の方法と言うわけでは当然なく、単なる一例として次の画像を作る際に私が行った過程を紹介します。 「あるふぁ亭」で公開している素材はすべてここで紹介するツールを使用して作成しました。すべて無料で手に入るツールばかりですので、Windowsを使用していて興味のある方は是非試してみてください。もちろん、有料のソフトをお持ちなら、もっと簡単に作成できるかも知れません。 このページではαPNGをそのまま貼り付けています。Win版IE6を除く各ブラウザの最新版では正常に表示されると思いますが、次の画像が“正常な見た目”と同じに見えない場合はお使いのブラウザがαPNGに対応しておらず、こちらの意図とは違う表
InternetExplorer7、Firefox、Opera等の現世代(もう次世代ではないよね?)ブラウザは半透明のPNG(PNG内のαチャンネルで透過の割合をピクセルごとに設定できるPNG)に対応している。これを背景やボタン画像に使用すると表現の幅がかなり広がる。 しかし、2008年夏現在、シェアがトップであると思われるInternetExplorer6ではこれに対応していない。WebデザイナーのためのIE6で何とかする方法のメモ。 キモ 結局のところ、CSSのIE独自拡張であるfilterで、 filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='trans.png',sizingMethod='scale'); などとしてやれば一応αチャンネル対応になる。 しかし、話はそう単純でなく、 イベント(マウスオーバー
来年も作りたい!ふきのとう料理を満喫した 2024年春の記録 春は自炊が楽しい季節 1年の中で最も自炊が楽しい季節は春だと思う。スーパーの棚にやわらかな色合いの野菜が並ぶと自然とこころが弾む。 中でもときめくのは山菜だ。早いと2月下旬ごろから並び始めるそれは、タラの芽、ふきのとうと続き、桜の頃にはうるい、ウド、こ…
最近はアルファチャンネルを含むPNG画像を利用したサイトが増えてきたように感じます。 2008年9月号のWeb Designing誌でも特集が組まれたりと、関心も高まっているようです。 ただ、そこで問題となるのはIE6のアルファチャンネル問題。 何らかの手段でこれを解決する必要があります。 少し前の仕事でこの問題を解決する必要があり、いくつかのライブラリを試してみたので、それをまとめてみます。 なお、img要素ではなく、CSSの背景画像で使用する場合として検証しました。 img要素にだけ適用したい場合には、もっとシンプルな方法があるかもしれません。 概ね共通する事 標準準拠のCSSのみでは不可能 IEの独自拡張の、filterプロパティを使う必要があります。 CSS内に記述する方法やhtcファイルを使う方法、JavaScriptを使う方法でも、結果的にはこのfilterプロパティのAlph
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く