hover img CSS

ロールオーバー画像をわざわざ作らずに、画像にマウスをあてたとき、白っぽくマウスオーバーするcss小技のメモ。

■ソース
<a href="#" class="imghover"><img src="image.jpg" /></a>

■cssソース
a.imghover:hover img {
filter: alpha(opacity=80);
opacity: 0.8;
}

80や0.8は、50や0.5などに変えると、濃さが変わります。試してみて下さい。

filterはIE向け。opacityはFirefox等向けに書かれています。