.mousemove()【《マウス移動》イベントハンドラ設定・実行】
メモ
- 《マウス移動》イベントハンドラ設定
.on( "mousemove" [, data], handler )の省略形- 解除は、.off( "mousemove" )【イベントハンドラ解除】
- マウスポインタ位置は、イベントオブジェクトの pageX・pageY 【マウスイベントｘ・ｙ座標】プロパティ
- 通常、上位の<body>【ドキュメントボディ】等において
mousedown《マウスボタンダウン》イベントで mousemove イベントハンドラ設定
mouseup《マウスボタンアップ》イベントで mousemove イベントハンドラ解除
- 《マウス移動》イベントハンドラ実行
.trigger( "mousemove" )の省略形- マウスポインタ位置は、undefined
構文
| 説明 | 構文 | 戻り値 | ||||||||||
|---|---|---|---|---|---|---|---|---|---|---|---|---|
| 《マウス移動》 イベントハンドラ設定 | .mousemove( handler ) 1.0 handler：イベントハンドラ
.on( "mousemove", handler )の省略形 | jQuery | ||||||||||
| .mousemove( [eventData ], handler ) 1.4.3 Anything eventData：イベントデータ handler：イベントハンドラ
.on( "mousemove", data, handler )の省略形 | jQuery | |||||||||||
| 《マウス移動》 イベントハンドラ実行 | .mousemove() 1.0.trigger( "mousemove" )の省略形 | jQuery |
例
<style>
#area { width:200px; height:200px; border:2px black solid; background-color:lightyellow; padding:5px; }
</style>
<p id="area"></p>
<button id="mousemove">.mousemove()</button>
<script>
$("#area").mousemove("DATA", function(eventObject) {
var msg = eventObject.type + "<br>[" + this.id + "]<br>( " +
eventObject.pageX + ", " + eventObject.pageY + " )<br>" + eventObject.data;
$(this).html(msg);
});
$("#mousemove").click(function() {
$("#area").mousemove();
});
</script>