hover(over, out)

解説

マウスホバー時のイベントハンドラをバインドします。

マウスカーソルが要素の上に乗った場合(over)、第1引数のイベントハンドラを実行します。 マウスカーソルが要素から外れた場合(out)、第2引数のイベントハンドラを実行します。

＊要素内にある別の要素にマウスカーソルが移動しても、第2引数のイベントハンドラは実行しません。

引数

• over
  Function: マウスカーソルが要素の上に乗った場合に実行するイベントハンドラ関数
• out
  Function: マウスカーソルが要素から外れた場合に実行するイベントハンドラ関数

戻り値

• jQuery: jQueryオブジェクト

例

例1:ボックスにマウスカーソルが入ると、背景色が橙色になります。 マウスカーソルが外れると、元の背景色に戻ります。
また、ボックス内のp要素にマウスカーソルが入っても、マウスカーソルが要素から外れたことにはならず、背景色は元に戻りません。

// マウスホバーイベント
$("#box").hover(
    function(){
        $(this).css("background", "orange");
    },
    function(){
        $(this).css("background", "#6495ed");
    }
);

ページトップヘ

ページトップヘ