js 获取鼠标在画布的位置_javascript求鼠标在canvas画布里的坐标

function f() {

var n = document.getElementById("myCanvas");

var c = n.getContext("2d");

var ev2 = event || window.event;

var x1 = ev2.PageX||ev2.clientX;

var y1 = ev2.PageY||ev2.clientY;

var x2 = n.offsetLeft;

var y2 = n.offsetTop;

var x = x1 - x2;

var y = y1 - y2;

document.getElementById("testid").innerHTML = "x1="+x1+",y1="+y1+",x2="+x2+",y2="+y2+",x="+x+",y="+y;

}

function f_onload()

{

var c=document.getElementById('myCanvas');

c.onmousedown = f;

c.onmousemove = f;

c.onmouseup = f;

document.onmousemove = null;

document.onmouseup = null;

}

window.onload = f_onload;

代码很简单就这么一点,

160X160的一个canvas画布,按理鼠标在画布里的时候,下面显示坐标的x,y都在0~160范围内。

单独用浏览器打开这段程序,很正常。

可是放在博客园的博客侧边栏公告里,x倒正常,y却都负了。。。。。。

现在已经确定是y1的问题,

现在发现是这样的,我只要把网页上下滚动拉到顶,那么就可以得到正确的值。也就是y1得到的不是网页内的坐标,而是网页可视范围上的坐标。

请问y1怎么改,如何才可以得到正确的坐标?

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值