李霖弢
李霖弢

鼠标无限移动 JS API Pointer Lock简介

  • 允许鼠标无限移动 甚至脱离浏览器窗口范围

Pointer Lock API有哪些具体API名称

3个属性
  • Document.pointerLockElement
//指当前页面触发鼠标无限滚动的元素，通常使用语法为：
var element = document.pointerLockElement;
//返回的是一个DOM元素对象，如果当前页面是非鼠标锁定状态，则返回值是null。

  • Document.onpointerlockchange

  • Document.onpointerlockerror

2个方法

Element.requestPointerLock()

//可以让页面进入鼠标锁定状态（鼠标直接消失），鼠标无限滚动，坐标无限变化。通常使用语法为：
var element.requestPointerLock();

Document.exitPointerLock()

//让页面从鼠标锁定状态退出，通常使用语法为：
document.exitPointerLock();
//浏览器默认支持按下ESC键退出鼠标锁定状态，但是用户有时候更习惯于点击取消等，此时就可以使用document.exitPointerLock()进行设置。
2个事件

pointerlockchange

//当页面鼠标锁定状态改变的时候触发。例如：
document.addEventListener('pointerlockchange', function () {
    // ...
}, false);

pointerlockerror

当页面鼠标锁定失败的时候触发。例如当你试图同时锁定同一个页面的多个