[Résolu] Ontouch events

Bonsoir

J'ai une page qui s'affiche très bien sur PC et tablette, mais j'ai un problème pour simuler un "onmouseleave" avec un évènement "ontouch".
J'ai une fenêtre qui a cette allure:

Quand on promène la souris en haut ou en bas de cette fenêtre, on voit apparaître des boutons permettant d'effectuer certaines actions:

Sur PC, si on bouge la souris en dehors de la "zone sensible", les boutons disparaissent.
Sur tablette, les boutons apparaissent si on touche la "zone sensible", mais ils ne disparaissent pas quand on lève le doigt, bien que la fonction hideInfo soit appelée aussi bien sur l'évènement ontouchleave que sur l'évènement onmouseleave:

bar.addEventListener('mouseover', showInfo, false);
bar.addEventListener('mouseleave', hideInfo, false);
bar.addEventListener('touchleave', hideInfo, false);

Voir http://jpmoularde.free.fr/3d-tours/kv23/index2.php
Merci de votre aide

Bonjour,

Si tu touches l'écran puis retire ton doigt, l'évènement mouseover peut se déclencher après touchleave, et du coup ça te fait le showInfo du mouseover après le hideInfo du touchleave.

D'une manière générale, les touch events se déclenchent avant les mouse events (mais y a des exceptions : c'est le bazar, les touch events, et les comportements sont variables selon les machines et les navigateurs).

Il est aussi possible que touchleave ne se déclenche jamais.

Essaie déjà dans la fonction hideInfo de mettre un preventDefault() pour empêcher les mouse events de se déclencher à la suite des touch events, et donc pour empêcher un showInfo de s’exécuter après ton hideInfo.

Après, il faudra aussi t'assurer que tu as bien tous les évènements que tu attends qui se déclenchent (j'ai de gros doutes pour touchleave), et si c'est bien ça qu'il te faut (a priori, j'aurais ici considéré l'utilisation uniquement de touchstart avec un premier touchstart qui fait apparaitre les boutons et un deuxième qui les fait disparaitre : certainement plus robuste).

Amicalement,
Modifié par parsimonhi (13 Feb 2016 - 02:03)

Merci de ta réponse

Difficile de faire de la mise au point avec une tablette, y a-t-il un FireBug sur iPad ?

Je vais mettre une fonction showHideInfo sur touchstart pour voir ce que ça donne. Si ça marche j'en resterai là.

PapyJP a écrit :
Difficile de faire de la mise au point avec une tablette, y a-t-il un FireBug sur iPad ?

C'est typiquement le genre de problème que tu ne peux pas espérer tester avec des outils de simulation de manière fiable, même quand ceux-ci existent.

Amicalement,

Merci parsimonhi
J'ai donc mis une fonction showHideInfo sur l'évènement touchstart et ça fonctionne de façon satisfaisante.
J'ai l'impression que l'utilisation des évènements "touch" est un domaine très délicat, et que si on veut une seule version de code pour les tablettes et les ordinateurs ça doit être assez coton.