不使用innerWidth / innerHeight或clientWidth / clientHeight检测画布点击

时间:2018-08-16 23:11:29

标签: javascript html canvas click mouse

我正在使用HTML5 Canvas和JavaScript制作多人在线游戏。

HTML5画布占据整个屏幕:

position:fixed;
width:100%;
height:100%;

这是问题所在... 我想在游戏上放置可点击的对象(fillRect),如果没有以下代码,我将无法获得正确的鼠标x和y位置:

canvas.width = window.innerWidth;
canvas.height = window.innerHeight

我希望画布的宽度和高度为200,但仍要占据整个屏幕。我可以使用此代码,但是点击不会正确显示:

canvas.width = 200;
canvas.height = 200;

我该怎么办?我的clientWidth值在我的PC上是1300,在我的android上是320 ...我希望我的游戏适合所有屏幕,并为鼠标提供正确的x和y坐标,而不更改宽度。 我希望画布占据整个屏幕,但宽度仍为200。

预先感谢:D

0 个答案:

没有答案