javascript - 没有 Jquery 的 Canvas 上的鼠标坐标

标签 javascript canvas mouse jquery

我目前正在使用:

e.pageX - $("#canvas").offset().left

这是我使用 Jquery 的唯一目的,因此我更愿意仅使用 javascript 重写它。

我可以用什么来代替它?

最佳答案

N Rohler 提供的答案仅在 Internet Explorer 中运行良好(IE8 之前有一些错误 - 但我想这对你来说不会成为问题,因为你使用的是 Canvas 和 pageX),并且在 Opera 中如果内边距为 0,在 Safari/Chrome 中,边框宽度也为 0。不幸的是,在 Firefox 中,offsetX 和 offsetY 未定义。 http://www.quirksmode.org/dom/w3c_cssom.html#mousepos

Kaninepete,为了简单起见,我认为您应该重新考虑获取相对于 Canvas 元素的鼠标坐标的方式。您所要做的就是计算 Canvas 的位置,这是使用 .getBoundingClientRect() 的一个非常简单的任务(另外,如果需要,不要忘记添加滚动偏移量),然后从 pageX 和 pageY 中减去它。 p>

关于javascript - 没有 Jquery 的 Canvas 上的鼠标坐标,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/7780615/

相关文章:

c# - java 服务器 <-> c# + javascript + java + * 客户端

javascript - 如何沿对 Angular 线或非正方形分割 Canvas

android - 如何将手机的屏幕坐标映射到电脑屏幕?

javascript - 缺少 : after property ID

javascript - 如何识别html页面中的后退 Action ?

javascript - Loopback组件存储移动设备/ postman 上传的文件

javascript - HTML5 Canvas 生成等距图 block

javascript - 为什么canvas的drawImage缩放比例不一致?

java - 机器人将鼠标放在窗口中

javascript - 即使光标位于屏幕边缘也可跟踪鼠标速度