元素:releasePointerCapture() 方法
releasePointerCapture()
是 Element
接口的方法,它会释放(停止)之前为特定(PointerEvent
)指针 设置的 指针捕获。
语法
js
releasePointerCapture(pointerId)
参数
pointerId
-
pointerId
是PointerEvent
对象的属性。
返回值
无(undefined
)。
异常
NotFoundError
DOMException
-
如果
pointerId
与任何活动指针都不匹配,则抛出此异常。
示例
此示例在您按下 <div>
时在其上设置指针捕获。这允许您水平滑动元素,即使您的指针移出其边界。
HTML
html
<div id="slider">SLIDE ME</div>
CSS
css
div {
width: 140px;
height: 50px;
display: flex;
align-items: center;
justify-content: center;
background: #fbe;
}
JavaScript
js
function beginSliding(e) {
slider.onpointermove = slide;
slider.setPointerCapture(e.pointerId);
}
function stopSliding(e) {
slider.onpointermove = null;
slider.releasePointerCapture(e.pointerId);
}
function slide(e) {
slider.style.transform = `translate(${e.clientX - 70}px)`;
}
const slider = document.getElementById("slider");
slider.onpointerdown = beginSliding;
slider.onpointerup = stopSliding;
结果
规范
规范 |
---|
指针事件 # dom-element-releasepointercapture |
浏览器兼容性
BCD 表格仅在启用 JavaScript 的浏览器中加载。