在一个div里面定位鼠标的相对坐标

一般我们在页面定位鼠标的坐标位置时,指的是屏幕的坐标。

$("#canvas").mousedown(function(e){

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

 mouseY1 = e.pageY - $("#canvas").offset().top;

}); 

其中e.pageX和e.pageY是鼠标相对于整个屏幕的坐标。

offset()是jquery里面的一个方法,主要是定位某一个容器(div)距离屏幕或者父元素的相对偏移量。如果用

e.pageX - $("#canvas").offset().left;//得出鼠标在容器内的坐标X,以容器的左上角为坐标原点

e.pageY - $("#canvas").offset().top;//得出鼠标在容器内的坐标Y,以容器的左上角为坐标原点

这样就可以解决在元素里面进行canvas的涂鸦的时候,画笔痕迹漂移的问题了。很管用!

相关推荐