≪ Today I learned. RSS購読
公開日
タグ
JavaScript
著者
ダーシノ(@bc_rikko)

ポインターが要素からはみ出ても位置を追い続ける

ドラッグで要素を移動させる系UIのとき、ターゲットからポインターがはずれたときやウィンドウから外に出たときにバグる時がある(mouseupが効かないとか位置がズレるとか)

Element#setPointerCapture()を使うと、Element#releasePointerCapture()が実行されるかpointerupされるまでキャプチャし続ける。

obj.addEventListener('pointerdown', (e) => {
  ...
  obj.setPointerCapture(e.pointerId)
})

obj.addEventListener('pointerup', (e) => {
  ...
  obj.releasePointerCapture(e.pointerId)
})