Javascript 随光标位置移动
我正在做一个游戏的桨球，我已经设计和脚本下的边界球。 我想做一个更多的桨，它可以随着当前鼠标位置移动。 我怎么知道？ 这是我的球在边界下移动的代码，我需要一个桨在底部Javascript 随光标位置移动,javascript,html,html5-canvas,2d-games,Javascript,Html,Html5 Canvas,2d Games,我正在做一个游戏的桨球，我已经设计和脚本下的边界球。 我想做一个更多的桨，它可以随着当前鼠标位置移动。 我怎么知道？ 这是我的球在边界下移动的代码，我需要一个桨在底部 <!doctype html> <html> <body onload="init();"> <script> var context; var x=150; var y=150; var dx=2; var dy=4; function init() { context= m
<!doctype html>
<html>
<body onload="init();">
<script>
var context;
var x=150;
var y=150;
var dx=2;
var dy=4;
function init()
{
context= myCanvas.getContext('2d');
setInterval(draw,10);
}
function draw()
{
context.clearRect(0,0, 300,300);
context.beginPath();
context.fillStyle="#98bf26";
// Draws a circle of radius 20 at the coordinates 100,100 on the canvas
context.arc(x,y,10,0,Math.PI*2,true);
context.closePath();
context.fill();
// Boundary Logic
if( x<0 || x>300) dx=-dx;
if( y<0 || y>300) dy=-dy;
x+=dx;
y+=dy;
}
</script>
<canvas id="myCanvas" width="300" height="300" style="border:1px dotted #111;" >
</canvas>
</body>
</html>
var语境；
var x=150；
变量y=150；
var-dx=2；
var-dy=4；
函数init（）
{
context=myCanvas.getContext（'2d'）；
设置间隔（抽签，10）；
}
函数绘图（）
{
clearRect（0,03000）；
context.beginPath（）；
context.fillStyle=“#98bf26”；
//在画布上的坐标100100处绘制半径为20的圆
弧（x，y，10，0，Math.PI*2，true）；
closePath（）；
context.fill（）；
//边界逻辑
如果（x300）dx=-dx；
如果（y300）dy=-dy；
x+=dx；
y+=dy；
}
myCanvas.onmousemove = mouse_move_callback
mouse\u move\u callbackfunction mouse_move_callback(ev) {
// Get mouse position
if (ev.offsetX) {
c_x = ev.offsetX;
c_y = ev.offsetY;
}
if (ev.layerX) {
c_x = ev.layerX;
c_y = ev.layerY;
}
// Update paddle position
update_paddle(c_x,c_y);
}
您需要为画布实现一个
mousemovemousemove