Исправлен указатель мыши с перетаскиванием jQuery - PullRequest
3 голосов
/ 04 мая 2010

Я создаю небольшую игру в HTML5. Элемент canvas - это окно просмотра игрового мира. Пользователь может перемещать положение области просмотра в мире, щелкая и перетаскивая мышью маленький значок.

Проблема заключается в том, что прокрутка останавливается, когда указатель мыши достигает края экрана. По всей вероятности, это сильно ограничит прокрутку в одном из направлений, поскольку значок будет находиться в одном из углов страницы.

Единственное техническое решение, которое я могу придумать, состоит в том, чтобы как-то зафиксировать положение указателя мыши на значке и определить относительное движение каждого кадра. По сути, я бы просто сбрасывал позицию указателя обратно в центр значка после каждого события перетаскивания. К сожалению, я довольно уверен, что это невозможно. Игра с указателем пользователя - это большая проблема с точки зрения удобства использования и безопасности.

Итак, есть ли другой способ сделать то, что я хочу? Я в первую очередь ищу технические идеи, но предложения по более подходящему интерфейсу также приветствуются.

1 Ответ

4 голосов
/ 04 мая 2010

Три возможных решения:

  1. Переместите этот значок "джойстик" на 100 пикселей от угла. Дайте ему непрозрачность, пока он не завис. Удерживайте нажатие и перетаскивание «сустейн», чтобы при перетаскивании и удерживании курсора в 40 пикселях от центра джойстика происходило непрерывное панорамирование экрана.

  2. Используйте стрелки, похожие на Google Maps . (Вы также можете комбинировать это с первым решением, изменив часть ручного захвата на часть «джойстик».)

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

...