- ベストアンサー
画像マウスオーバーのエフェクト
以下のサイトのように画像にマウスオーバするとハイライト（この言葉が正しいかわかりませんが）するエフェクトはどうやるのでしょうか？ http://kanasoku.blog82.fc2.com/blog-entry-15829.html かなり基本的な質問ですが教えてください。 よろしくお願いいたします。
- みんなの回答 （3）
- 専門家の回答
質問者が選んだベストアンサー
a:hover img{ filter: alpha(opacity=80); -moz-opacity:0.80; opacity:0.80; } で可能です。 参考URL先で解説されてます。
その他の回答 (2)
- pasocom
- ベストアンサー率41% (3584/8637)
＃１です。 ご提示のサイトでの「画像のハイライト」というのがどれのことなのかよくわかりません。サイト上部のメニュー部分（「かな速あんてな」「かな速にゅーす」・・）の部分でしょうか。 ここであれば、こういうのは画像を二つ用意して、マウスオーバーで画像を切り替えているのです。 下記の「JAVATEAはいかが？」内、「JAVATEA12：マウスを当てただけで画像を切り替えます 」を参照下さい。 http://www.geocities.jp/digitwland/javatea/javatea.html
- pasocom
- ベストアンサー率41% (3584/8637)
ご提示のサイトページでは「画像」がハイライトするのではなく、「テキスト（文字）」がハイライトするようです。テキストで良ければ、 HTMLにおいて<body>タグの前段階（<head>タグ内）で以下のように記述すればいいです。 <head> <style type="text/css"> <!-- A:hover {color="#rrggbb";} A {text-decoration:none} A {color:"#rrggbb"} --> </style> </head> 意味は・・・、 A:hover {color="#rrggbb";} →マウスオーバーの時の色を指定。 A {text-decoration:none} →リンクテキストのアンダーラインを省略。 A {color:"#rrggbb"} →マウスオーバーしない時（通常時）のテキストの色を指定。 なお、こういう場合にはアダルトでないサイトをご提示頂く方が支障が少ないかと思いますのでご配慮下さい。
補足
回答ありがとうございます。 テキストのマウスオーバーはわかるのですが、画像マウスオーバー時のエフェクトの方法がわかりません。 CSSで行うようなのですがやり方がわかりましたら 引き続きご教授ください。 よろしくお願いいたします。