jquery：hover(f1,f2)

このイベントの説明

jQueryの hover(f1,f2) は、HTML要素にマウスが乗った時のイベント処理と、外れた時のイベント処理を記述します。

構文

セレクタ.hover(function(){マウスがONした時の処理},function(){OFFした時の処理})

事例

①BOXにカーソルが乗ったらBOXの色を変える。

下記のBOXにカーソルをONして下さい。

背景色が赤に変わります。

カーソルが外れると元に戻ります。

上記は下記のプログラムから構成されています。

<div class='box' style='cursor:pointer;;border:1px solid black;width:100px;height:100px;background:blue;'>
</div>
<script>
$(function(){
	$('.box').hover(
		function(){
	 		now_color = $(this).css('background');
	 		$(this).css('background','red');
		},
	 	function(){
	 		$(this).css('background',now_color);
	 	}
	);
});
</script>

■1～2行目：HTML

■4～14行目：jQuery

参考情報

その他の イベント発生のメソッド も参照してください。