テクニカルノート

アンカータグをマウスオーバーしたときに、要素を透過にして、半透明な感じにする方法

a:link {
 color: #55e;
}
a:visited {
 color: #55e;
}
a:hover, a:active {
 opacity: 0.5;
 filter: alpha(opacity=50);
}

opacity: 0.5

opacityは、0.5で透明度50％。
1を指定すると、100%で透過なしになります。0を指定すると完全に消えてしまいます。

filter: alpha(opacity=50);

filter: はIE用。

opacity=50で、透明度50%   JQueryを使って、やんわり透過するには、

$("a").hover(
      function() {
           $(this).fadeTo(200,0.5);
      },
      function() {
           $(this).fadeTo(200,1);
      });

fadeTo を使うと簡単です。

マウスオーバーの時、fadeTo(200,0.5) で、0.2秒かけて透明度50%にします。
マウスが離れたら、fadeTo(200,1)で戻します。