Вопрос

Я строю игру Breakout, используя jQuery и <canvas> элемент. Чтобы контролировать весло, он будет следовать мышью. Так что мне нужно получить координаты мыши в моем drawPaddle() метод.

Глядя на сайт jQuery, у него есть такие примеры:

$(document).mousemove(function(e){
    $('#status').html(e.pageX +', '+ e.pageY);
});

Что делает то, что я хочу, но я не хочу добавлять другую функцию в мой проект, как это. Это мой drawPaddle() Метод:

function drawPaddle() {
    c.beginPath();
    c.rect(paddleX, paddleY, 150, 10);
    c.closePath();
    c.fill();
    // Get mouse position and update paddleX and paddleY here
}

Так что мне нужно найти способ получить место мыши всякий раз, когда drawPaddle() называется, а не всякий раз, когда мышь перемещается на страницу, как $(document).mousemove(function(e){ делает.

Любая помощь ценится, спасибо.

Это было полезно?

Решение

$('canvas').mousemove(function(e){
    drawPaddle(e.pageX, e.pageY);
});


function drawPaddle(paddleX, paddleY) {
    c.beginPath();
    c.rect(paddleX, paddleY, 150, 10);
    c.closePath();
    c.fill();
}

Другие советы

Вам нужно будет сделать

var where = {}
$('canvas').mousemove(function(e){
    where.x = e.pageX
    where.y = e.pageY;
});

а затем использовать, y в функции

Я думаю, что нет способа сделать это без события. Я не знаю поля в JavaScript, который хранит эту информацию по всему миру. Некоторое время назад у меня была такая же проблема и сделала это с mousemove Событие, потому что я не нашел другого решения. Может быть, какой-то браузер реализует способ получить эти координаты, но я не знаю.

Но, возможно, вы можете использовать mouseenter и mouseleave События на вашем холсте, чтобы включить / отключить захват положения мыши. Это уменьшит вызовы функций.

Лицензировано под: CC-BY-SA с атрибуция
Не связан с StackOverflow
scroll top