* onmousemove 属性 (HTML, XHTML 1)
[1] [[HTML]] のほとんどの要素で用意されている
[DFN[[CODE(HTMLa)[onmousemove]] 属性]]は、
[RUBYB[指示装置] [pointing device]]がある[[要素]]の上で
(その要素から出入りせずに) 動かされた時に発生する[[事象]]に関する[[内在事象]]属性です。
[2] 仕様書:
- [[HTML 4]]
-- [CODE(HTMLa)[onmousemove]] 属性
** 代替
[3] 内在事象属性は[[表現と構造の分離]]の原則に反するので、
好ましくないと考える人もいます。また、 [[DOM 0]]
に基づく古い設計です。
代わりに、 [CODE(HTMLe)[[[script]]]] 要素などにより関連付けたスクリプト内で
[[DOM 2]] 以上の[[事象]]に関するメソッド等が利用できます。
DOM 水準2 や DOM 水準 3 はこの属性に対応する
DOM の事象 [CODE(DOM)[[[mousemove]]]] を用意しています。
[[#comment]]
** 属性値
[4] この属性の値は [CODE(SGML)[%[[Script]]]] です。 [[SGML]]
的には [CODE(SGML)[[[CDATA]]]] です。
自称が発生したときに実行するスクリプトの code
を記述します。[[スクリプト言語]]は、
[CODE(HTTP)[[[Content-Script-Type]]]] によります。
[5] この属性は省略可能です。
[[#comment]]
** 関連
[6] この属性に対応する DOM の事象は [CODE(DOM)[[[mousemove]]]]
です。そちらもあわせてごらんください。
[7] 別の要素に移動したときには [CODE(HTMLa)[[[onmouseout]]]]
事象が、別の要素から移動してきたときには [CODE(HTMLa)[[[omouseover]]]]
事象が発生します。
[8] [[ドラッグ・アンド・ドロップ]]を[[スクリプト]]により実装したい時には、
[CODE(DOMe)@en[[[mousemove]]]] と [CODE(DOMe)@en[[[mousedown]]]],
[CODE(DOMe)@en[[[mouseup]]]] を組み合わせると便利です。
;; [CODE(DOMe)@en[[[mousedown]]]] は[[ドラッグ]]したい[[要素]]でだけ listen
しておけばいいのですが、 [CODE(DOMe)@en[[[mousemove]]]] や
[CODE(DOMe)@en[[[mouseup]]]] は[[ドラッグ]]中に[[マウス・ポインター]]が[[要素]]の[[箱]]から外れることを考慮して[[ドラッグ・アンド・ドロップ]]可能な領域全体で
listen しておいたほうがいいです。
[[#comment]]
** メモ
[9]
[[ニンテンドーDSiブラウザー]]では [CODE(DOMe)@en[[[mousemove]]]] が[[発火]]されるだけでかなり処理が重たくなります。中の処理を減らしたりしてもあまり変わらない。
[CODE(CSS)@en[[[position]]: [[absolute]]]] にすると極端に重さが増します。
[10] [[ニンテンドーDSiブラウザー]]は [CODE(HTML)[[[viewport]]]] を入れて高さ172px以下にすればマウスイベントが発生します。それより長くなるとスクロールになります。 [CODE(CSS)@en[[[position]]:[[absolute]]]] なら175px
までいけます。
[11] 3DS では普通にペンでなぞっても mousemove が発生しないので、ありがちな
[CODE(HTMLe)@en[[[canvas]]]] を使ったお絵かきは実現不可能です。ペンのタッチイベントは、
- タッチしてすぐ離せば mouse* 一式と click が順番に発生します。
- 1秒くらい同じ場所で長押しして文字列選択モードに入ると mouse* 一式がリアルタイムに発生します。
... の2通りのケースで取得できます。
後者で従来スタイルのお絵かきが実現できそうに思えますが、何か描くために毎回1秒くらい長押ししないといけないのは意外と辛く、文字や本格的な絵を描く用途には向きません。