Glisser sur la toile JavaScript

Question

J'ai utilisé les mousedown, mousemove et d'autres événements tactiles, mais aucun d'entre eux n'a semblé résoudre mon problème.

Mon but est d'essayer d'obtenir un objet qui suit le doigt ou la souris de l'utilisateur. J'ai essayé d'utiliser mousemove, et cela a fonctionné, mais seulement sur l'ordinateur. Sur un appareil mobile, il a échoué, seulement après le début du robinet, et rien d'autre.

Je pense que le problème peut être causé parce que sur un ordinateur, si la souris est cliquée et déplacée, l'ordinateur le perçoit comme un frein. Sur mobile, un glisser pourrait signifier que vous n'avez pas fini avec le robinet.

Des idées sur quoi utiliser, ou quel est le problème?

Merci d'avance!

Voici quelques exemples de code

document.addEventListener("mousemove", function(e){ 
    var x = e.pageX; 
    var y = e.pageY; 
}); 

Answer 1

Pour l'entrée de l'écran tactile, vous devrez utiliser le touch-event API. Ces API inclut

• touchstart
• touchEnd
• touchcancel
• touchmove

Alternativement, si vous pouvez expérimenter avec les nouvelles API pointer event.
Avec cela, vous pouvez écrire du code similaire à l'aide de l'événement de la souris. par exemple.

• mousedown> pointerdown
• mouseup> pointerup
• mousemove> pointermove

Cette spécification intègre différentes entrées de souris, écrans tactiles, et des stylos, rendant les implémentations séparées ne sont plus nécessaires et la création pour les pointeurs inter-appareils plus facile. Ne pas confondre avec la propriété CSS "pointer-events" sans rapport. - caniuse

Cependant, il n'est pas encore bien pris en charge par les autres navigateurs. Voir pointer's browsers compatibility

Heureusement, il y a une polyfill pour cette https://github.com/jquery/PEP