過去ログ表示


過去ログ 154 を表示

トピック内全 6 記事中の 1 〜 6 番目を表示
[ 最新記事及び返信フォームをトピックトップへ ]
このトピックの全ページ / [0]

透過gifがきちんと透過されない
(#24306) このトピック中1番目の投稿
(環境: WinXP SP2/Firefox1.0.6)

サイト製作で、メニューアイコンに透過gifを使おうと思っているんですが
CSSで

a:hover { background-color:#・・・ }

のようにして透過部分の色を変えようと思っているのですが、IEでは全く問題ない
のにFireFoxブラウザ(ver.1.0.6)で見ると、透過部分の下半分しか透過されないおうになります。
(透過部分の上半分が透過しない)


他のGeckoエンジンつきのブラウザでも同じようになったので、Geckoの
仕様なのか単なるミスなのか、それだけでもご教授いただけませんでしょうか?

Re[1]: 透過gifがきちんと透過されない
(#24307) このトピック中2番目の投稿
(環境: Win2000/Firefox1.0)

サンプルで構わないので、どこかでそれを表示してもらえませんか?

Re[1]: 透過gifがきちんと透過されない
(#24309) このトピック中3番目の投稿
(環境: WinXP SP2/seamonkey1.0a)

2005/08/24(Wed) 15:52:52 編集(投稿者)

> FireFoxブラウザ(ver.1.0.6)で見ると、透過部分の下半分しか透過されないおうになります。
> (透過部分の上半分が透過しない)


下半分というか、下の一部という感じですね。
仕様のような気がします。

正攻法ではないですが、透過画像の高さに応じて
a { font-size: ***px ; } ・・・・ ***の部分は透過画像の高さ以上の数値
と定義することでとりあえずはしのげるようです。

Re[1]: 透過gifがきちんと透過されない
(#24310) このトピック中4番目の投稿
(環境: Win2000/Mozilla1.7)

> サイト製作で、メニューアイコンに透過gifを使おうと思っているんですが
> CSSで
>
> a:hover { background-color:#・・・ }
>
> のようにして透過部分の色を変えようと思っているのですが、IEでは全く問題ない
> のにFireFoxブラウザ(ver.1.0.6)で見ると、透過部分の下半分しか透過されないおうになります。
> (透過部分の上半分が透過しない)
>
>
> 他のGeckoエンジンつきのブラウザでも同じようになったので、Geckoの
> 仕様なのか単なるミスなのか、それだけでもご教授いただけませんでしょうか?

画像は透過されているはずです。
a:hoverの中のimg要素のbackground-colorも変更したいわけなので
> a:hover { background-color:#・・・ }
の下にでも
a:hover img{ background-color:#・・・ }
と追加してください。

Re[1]: 透過gifがきちんと透過されない
(#24313) このトピック中5番目の投稿
(環境: WinXP SP2/Firefox1.0.6)

> サイト製作で、メニューアイコンに透過gifを使おうと思っているんですが
> CSSで
>
> a:hover { background-color:#・・・ }
>
> のようにして透過部分の色を変えようと思っているのですが、IEでは全く問題ない
> のにFireFoxブラウザ(ver.1.0.6)で見ると、透過部分の下半分しか透過されないおうになります。
> (透過部分の上半分が透過しない)
>
>
> 他のGeckoエンジンつきのブラウザでも同じようになったので、Geckoの
> 仕様なのか単なるミスなのか、それだけでもご教授いただけませんでしょうか?
これは多分Geckoエンジンの仕様です。
CSSのA:hover{〜}でborderやbackground等を指定しても、
アンカータグの内側にある画像の高さやフォントの大きさは無視され、
タグの外側のフォンとサイズなどと同じ高さまでしか表示されません。
対処法についてはKK様の仰るようにCSSであらかじめ高さを指定すれば解決します。

Re[2]: 透過gifがきちんと透過されない
(#24327) このトピック中6番目の投稿
(環境: WinXP SP2/Firefox1.0.6)

皆さん返答ありがとうございます。

>tyさん
サンプルを提示…忘れてましたw
文面だけでは分かりにくい問題ですよね、確かに。
次にここに書き込むときは気をつけます

>daiさん
なるほど。やはり仕様なのですか。
確かに仰られた様に定義してみたらきちんと表示されました。
ありがとうございます。

>KKさん

>画像は透過されているはずです。

ええ、自分でも確認してみましたがきちんと透過されています。

>a:hoverの中のimg要素のbackground-colorも変更したいわけなので
>> a:hover { background-color:#・・・ }
>の下にでも
>a:hover img{ background-color:#・・・ }
>と追加してください。

なるほど、こういう方法もあるのですねー。
勉強になりました。

>U-RIA+さん
詳細な解説ありがとうございます。
前のお二人の対処法のどちらかで対応しようと思います。


回答していただいた皆様、改めてありがとうございました。
済!

このトピックの全ページ / [0]

返信不可


- Child Tree -