IEの透過PNG+opacityの不具合を治すメモ - Mach3.laBlog
この記事は賞味期限切れです。（更新から1年が経過しています） 透過PNGの処理が下手くそなのは、IE6だけではなく、IE7/8も同様です。 IEで透過PNGをあてた要素のopacityを弄ると、周りがグレーがかって汚くなります。 この現象はよく知られていると思いますが、今日はこの不具合の治し方のメモを記しておきます。 サンプルコード 例えば、こんなコード。 <style> .test { display:block; width:128px; height:128px; background:url(./test.png) 0 0 no-repeat transparent; } .test:hover { background-image:url(./test-hover.png); } </style> <a href="#" class="test"></a> test.pngとte
【jQuery】IE8以下で透過PNGのopacityアニメーションが黒く汚れるのを回避する | バシャログ。
そうめんと水出しのお茶があれば生きていける気がしてきたhakoishiです。 さて、今回はjQueryで透過PNGのopacityアニメーションがバグるのを回避する方法です。 透過画像をアニメーションさせた時、IE8以下でフチが黒くなって困った経験をお持ちの方、いらっしゃるのではないでしょうか？ 発現条件 発現する条件は、この4点です。 画像は透過png。 画像自体にopacityアニメーションを設定している。 画像にフィルター（AlphaImageLoader）をかけている。 ブラウザはIE8以下。 回避するためのポイント 回避するためのポイントはこの2点。 画像にフィルター(AlphaImageLoader)をかける。 アニメーションの対象を、その画像を包括する要素にする。 移動やサイズ変更もしたい場合、包括要素も画像と同じサイズにしておくと扱い易いと思います。 サンプルを作りましたの
IE8以下で透過PNGが黒くなる場合の対処法 | 技術屋のメモ | WEB/アプリ開発技術メモ
IE8以下で透過PNGが黒くなる場合の対処法 by ateliee · 公開済み 2013年3月28日 · 更新済み 2017年3月25日 こんにちわ。film Power Rangers 今回は透過PNGを使った場合に陥りやすいバグの対応方法についてご紹介いたします。 IE8やIE7などで透過pngを使った場合、背景が黒くなる場合があります。 opacityなどの透過指定をしている場合にもおきるかもしれません。 そういった場合、IE独自の指定をする必要があります。 [css] img.png{ filter’: ‘progid:DXImageTransform.Microsoft.AlphaImageLoader(src=”sample.png”, sizingMethod=”scale”); } [/css] CSSにて透過PNGを使っている要素にprogid:DXImageTrans
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
