javascript - 有没有办法让 css3 类跟随鼠标光标

Question

我对 CSS3 和 JavaScript 很陌生，我正在研究这个主题几天。我想用图像遮盖照片。我想让面具跟随鼠标指针。我读到屏蔽是使用类属性 mask 或 mask-image 完成的，后跟图像的 url。有没有办法在鼠标移动时重新定位此蒙版？

Answer 1

当然，只需要使用 JavaScript 来监听 mousemove 事件:

是这样的:

document.getElementById('myVerySpecificContainer').addEventListener('mousemove', function(event) {
  // reposition whatever with the event coordinates (clientX, clientY, screenX, screenY)
}

完成后，removeEventListener 因为这是一个非常昂贵的事件。

可在此处找到可用的事件属性: https://developer.mozilla.org/en-US/docs/Web/Events/mousemove