jQueryでマウスオーバーハイライト処理
マウスオーバーで画像をハイライト処理します。マウスオーバー画像を用意する必要もなくなりますので、リンクを画像で表現している場合などで重宝します。
※「a img」は適宜変更する(ハイライトの対象となるセレクタを記述する)。
※実は画像以外でも利用可能(cssで作ったボタンなど)。
var effect = new Effect('a img'); effect.highlight(); var Effect = function(ele) { this.Ele = ele; }; Effect.prototype = { highlight: function() { var ele = this.Ele; $(ele).bind('mouseout', function(){ $(this).fadeTo(200, 1.0); }); $(ele).bind('mouseover', function(){ $(this).fadeTo(200, 0.5); }); } };