Скрыть курсор мыши, когда он находится в HTML5 Canvas Javascript

В процессе создания игры я использую Javascript и элемент холста html5 в качестве альтернативы Flash. Мой вопрос: есть ли какой-нибудь бит кода, который я могу использовать, чтобы скрыть указатель мыши/указатель, когда он проходит внутри холста? Помощь очень ценится!

Ответ 1

Я не думаю, что для этого вам нужен Javascript, вы можете просто использовать CSS. Назначьте свой холст div id/class, а затем используйте его в своем шаблоне CSS:

* {cursor: none;}

Ответ 2

Вы можете использовать javascript для управления стилем курсора. Код:

<div id="canvas_div_no_cursor">
   <!-- canvas here -->
</div>
<script type="text/javascript">
  document.getElementById('canvas_div_no_cursor').style.cursor = "none";
</script>

Ответ 3

Самый простой способ (в современных браузерах) - установить курсор на none на холсте.

Если ваш холст создан в HTML, выполните следующие действия:

<canvas id="canvas" style="cursor: none;"></canvas>

Я бы одобрил это по стилю, потому что вы хотите гарантировать, что значение курсора не перегружено.

Если ваш холст создан в JavaScript, выполните следующие действия:

const canvas = document.createElement('canvas');
canvas.style.cursor = 'none';
document.body.appendChild(canvas);