マウスカーソルの開始点と停止点はどのようにして決定できますか？

Question

ユーザーがマウスの移動を開始し、ブラウザのどこかで停止するとします。 Javascript/Jqueryで開始点と終了点を決定するにはどうすればよいですか？

スタートポイントは簡単ですが、私はmousemoveイベントでそれを手に入れることができますが、停止点はどうですか？

私の運動場は、ウィンドウや文書そのものなので、mouseenterやmo​​useleaveイベントは使用できません。

ありがとうございます。

Answer 1

setTimeoutとclearTimeoutの組み合わせを使用します。 ユーザーがx秒間移動しない場合は、彼が停止したことを意味します。

ここで私はあなたに例を書いた：のMouseMoveイベントが最初に発生したときに

<script type="text/javascript"> 
    var lastMove = 0; 
    var lastTimeout = 0; 
    jQuery(document).ready(function() { 
     $(document).mousemove(function (e) { 
      $('#status').html(e.pageX + ', ' + e.pageY); 
      var currentMove = (new Date()).getTime(); 
      if (lastTimeout != 0) { 
       clearTimeout(lastTimeout); 
      } 
      if (currentMove - lastMove > 1500) 
      { alert('started'); } 
      lastMove = currentMove; 
      lastTimeout = setTimeout(function() { 
       var currentMove = (new Date()).getTime(); 
       if (currentMove - lastMove > 1500) 
       { alert('stopped'); } 
      }, 1510); 
     }); 
    }) 
</script> 
<h2 id="status"> 
0, 0 
</h2> 

Answer 2

開始位置は、場所です。マウスが動かなくなるまで発射を続けます。したがって、mousemoveイベント関数にタイマー（setTimeout/clearTimeout）を追加すると、mousemove関数が呼び出されずに一定時間が経過した後にマウスが移動を停止したと言うことができます。