画面の端にカーソルが行ったらカーソル速度がとれない問題を解決するPointer Lock API

カーソルの速度を取りたいとき，
Javascriptだと普通，↓のような感じで変位をだして，それの時間微分的な処理で速度を近似すると思う．

// 位置
var currentX = e.clientX || e.pageX;
var currentY = e.clientY || e.pageY;

// 変位
var deltaX = currentX - lastMouseX;
var deltaY = currentY - lastMouseY;

でも画面の端にカーソルが到達してしまうと，
位置がまず変化しなくなるのでそれに応じて変位も速度も0になる．

それを解決する方法として， HTML5のPointer Lock APIがある．

demo

See the Pen Pointer Lock Demo by Yusuke Ujitoko (@ujitoko) on CodePen.

参考

http://www.formasterminds.com/quick_guides_for_masterminds/free_guides/Pointer_Lock_API.pdf