javascriptでDIV IDを使用してDIVにホバー効果を与えるにはどうすればよいですか？

Question

div idを使用して各divに異なるホバー効果を持たせたいとします。出来ますか？私はしばらくの間、Googleで検索してきました。クラス名とタグを使用してホバー効果を見るだけです。私はこれをjavascriptまたはjqueryを使用して行いたいです。どんな助けもありがとう、ありがとう！

Answer 1

あなたは関数内からidを評価することができます：

$(".hoverItems").hover(overState, outState); 

function overState() { 
    switch (this.id) { 
    case "foo" : 
     /* effect a */ 
     break; 
    case "bar" : 
     /* effect b */ 
    } 
} 

function outState() { 
    switch (this.id) { 
    case "foo" : 
     /* undo effect a */ 
     break; 
    case "bar" : 
     /* undo effect b */ 
    } 
} 

デモ：http://jsbin.com/evikog/edit#javascript,html

Answer 2

jQueryを使って、あなたがたMouseEventにアクションをバインドすることができます。 http://api.jquery.com/category/events/mouse-events/

をあなただけのイベントをバインドする必要がありますあなたのdivにあなたのアニメーションを行います...

$("#foo,#bar").hover(overState, outState); 

function overState() { 
     /* effect */ 
} 

function outState() { 
     /* undo effect */ 
} 

複数のdivをアニメーション化したい場合は、それらにクラスを与えます。たとえば、 "アニメーション"：

HTML：

<div class="animated">blabla</div> 

Javascriptを

$(".animated").hover(overState, outState); 

そのように、すべてのdivをアニメーションを持っていますアニメーションクラスで。

Answer 3

特定のスタイルのclass + idの組み合わせでCSSを使用することができます。