Залипалово!!! как добавить плавную реакцию на перемещение пальцем по экрану мобилки?

Question

[Роман]

В рамках изучения JS написали с ребенком эту заставку д̶л̶я̶ ̶м̶е̶д̶и̶т̶а̶ц̶и̶и̶ для залипания. На PC работает превосходно, отлично реагирует на плавные перемещения мышкой по экрану. На мобилках же реагирует только на одноразовый тап по экрану, что не позволяет плавно тянуть за собой центр эмиттера объектов. Никогда не писал под мобилки, опыта работы с тачскрином нет совсем, гугление тоже не помогло, по всей видимости не правильно спрашиваю :)

Собственно вопрос - как заставить браузер на мобилках реагировать на перемещение пальца по экрану по аналогии с перемещением мышки на PC?



PS: подправил ссылки. Теперь доступно всегда.

Answer 1

[barkalov]

Используйте событие touchmove вместо mousemove.
Только учтите, что это событие немного сложнее чем мышинное - тачей (пальцев) ведь может быть несколько одновременно, нужно это обрабатывать.

Comments

[Роман]

Спасибо

Answer 2

[profesor08]

Вот прям в консоли вбил, и заработало четко. Тебе достаточно вставить это в свой код.

canvas.addEventListener("touchmove", function(e) {
	const q = 1;
	const centerw = sheet.width/2;
	sheet.emitter.x = centerw-(centerw-e.touches[0].clientX)/q;

	const centerh = sheet.height/2;
	sheet.emitter.y = centerh-(centerh-e.touches[0].clientY)/q;
})

Comments

[Роман]

Спасибо