GAMURATWIST.JP BLOG

透明度を使ったロールオーバー

ナビゲーションやバナーなど、画像リンクを作るとき、
スタイルシートの透明度プロパティを用いて、hover を指定する方法。

a:hover img {
  opacity:0.7;
  filter: alpha(opacity=70); /* for IE6 */
}

jQuery でウインク効果

<script type="text/javascript" src="jquery.min.js"></script>
<script type="text/javascript">
$(function(){
   $("img.wink").hover(function(){
      $(this).css("opacity", "0.3");
      $(this).css("filter", "alpha(opacity=30)");
      $(this).fadeTo("slow", 1.0);
   });
});
</script>

このソースを記述し、ウインクさせたい img 要素に class="wink" を付加する。

UP