Maison >interface Web >js tutoriel >Solutions pour résoudre le problème de pénétration des événements touchstart sur les terminaux mobiles

Solutions pour résoudre le problème de pénétration des événements touchstart sur les terminaux mobiles

巴扎黑
巴扎黑original
2017-07-20 15:26:402362parcourir

[Source] : Lors du développement de sites Web mobiles, nous errons souvent entre le clic et le touchstart ; bien que touchstart soit facile à utiliser et répond rapidement, ses défauts sont également évidents lorsque nous utilisons touchstart à grande échelle, vous le constaterez. se déclenchera fréquemment lors du défilement de la page, ce qui entraînera une expérience peu conviviale ; par conséquent, vous ne pouvez pas dire lequel est bon ou mauvais individuellement, mais vous devez utiliser ses points forts et éviter ses défauts

De plus, pour ; la balise a, la méthode de saut sur le terminal mobile équivaut à un clic (d'après ma propre expérience réelle)

[Problème] Lorsque nous déclenchons touchstart sur la couche supérieure, le clic ou une balise sur la couche inférieure sera être déclenché en même temps (strictement Il se déclenche après 350 ms)

[Principe] C'est parce que le temps de déclenchement du clic est de 500 ms, et le temps de déclenchement du touchstart est de 350 ms. Depuis 500>350, l'utilisateur. a un problème de pénétration

[Solution] Il existe de nombreuses façons de résoudre le problème Si vous changez l'angle et la méthode, vous aurez des réponses différentes. Voici quelques méthodes que j'ai trouvées efficaces en pratique, pour référence seulement :

  1. Vous pouvez remplacer touchstart par touchend, car il faut 200 ms pour déclencher touchend, vous pouvez donc résoudre le problème du temps de déclenchement (c'est ce que j'utilise souvent pour gérer problèmes de clic)

  2. Tout le monde également Vous pouvez recouvrir un calque transparent sous le déclencheur, lui permettant de pénétrer dans ce calque transparent au lieu du calque avec les événements (cette méthode augmente le niveau et la complexité de codage)

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Déclaration:
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn