web-dev-qa-db-fra.com

Simuler des événements tactiles sur un navigateur PC

Je développe une application HTML pour l'iPad. En tant que tel, il utilise des événements tactiles et des animations webkit-CSS.

Jusqu'à présent, j'ai utilisé chrome comme environnement de débogage en raison de son mode développeur génial.

Ce que je voudrais, c'est pouvoir déboguer mon Html/JavaScript en utilisant le débogueur de Google-Chrome sur mon PC tout en simulant des événements tactiles avec ma souris.

Mon site n'a aucun événement multi-touch et aucun événement de souris (pas de souris sur iPad).

Je ne suis pas réellement intéressé à voir la disposition des applications, mais plutôt à déboguer son comportement.

Existe-t-il un plugin pour traduire les événements de la souris en événements tactiles sur un navigateur de bureau?

68
eshalev

Au 13 avril 2012

Dans Google Chrome développeur et versions canaries, il y a maintenant une case à cocher pour "Émuler les événements tactiles"

Vous pouvez le trouver en ouvrant les outils de développement F12 et en cliquant sur l'engrenage en bas à droite de l'écran.

on Chrome v22 Mac OS X

Pour l'instant (Chrome ver.36.0.1985.125), vous pouvez le trouver ici: F12 => Esc => Emulation. console

96
Simon Sarris

Le navigateur de bureau peut simuler des événements tactiles en important du JS + CSS supplémentaire. Jeter un coup d'œil à:

  1. addTouch
  2. membre fantôme
7
Vlad

Nous utilisons ce script: http://code.google.com/p/jquery-ui-for-ipad-and-iphone/ Il permettra à tous les événements de souris de votre application d'être déclenchés par le toucher événements à la place. Donc, comme nous avions déjà une application Web qui utilisait le clic droit, le glisser-déposer, etc., cela nous permettait d'exécuter toutes les mêmes fonctionnalités avec le toucher.

Je sais que c'est presque l'inverse de la simulation que vous recherchiez (vous devrez créer un script pour que votre application soit principalement utilisée par une souris) mais j'espère que cela vous aidera quand même.

2
bishbashbosh

Une autre façon de simuler le multi-touch sur un navigateur de bureau est le Touch Emulator of Hammer.js

2
Corne

Je suis tombé sur cette petite bibliothèque basée sur la bibliothèque JQ UI. Assez astucieux:

http://touchpunch.furf.com/

1

Si vous ciblez Webkit spécifiquement (iPad et tous), vous pouvez vous fier au code du gestionnaire d'événements normal (add/removeEventListener). Dans cet esprit, vous devez probablement vous contenter de quelques événements - par exemple, 'ontouchstart' devient 'onclick' en fonction de l'environnement.

Offhand, je ne connais aucune bibliothèque fournissant ce niveau de branchement, cependant. Assez facile à faire soi-même.

0
Ryan McGrath