Éviter les événements mouseover pour iOS

Question

Notre site Web utilise la bibliothèque overLIB pour afficher «plus d'informations» sur les liens cliquables au passage de la souris. Le résultat est que sur les appareils iOS, le premier clic entraînera l'apparition du texte survolant la souris, tandis que le second activera le lien. Quelle est la manière la plus simple de conserver le texte au-dessus de la souris pour les navigateurs autres que iOS, tout en le contournant pour les utilisateurs utilisant iOS, de sorte que pour iOS, les liens sont activés dès le premier clic?

Answer 1

Si vous voulez une solution facile, vous pouvez utiliser quelque chose comme Modernizr comme décrit ici: What's the best way to detect a 'touch screen' device using JavaScript?. Ensuite, vous pouvez lier vos événements overLIB aux classes sans contact, etc. De cette façon, vous pouvez adresser tous les utilisateurs d'appareils tactiles et pas seulement les utilisateurs d'iOS. Bien sûr, si vous voulez seulement les utilisateurs iOS, vous pouvez toujours renifler UA (http://www.quirksmode.org/js/detect.html), mais ce n'est pas recommandé. Cependant, vous avez toujours le problème que vous chargez le (s) script (s) overLIB pour les utilisateurs qui n'en ont pas besoin. Je pense que la meilleure façon d'éviter cela dépend du reste de votre pile.

Une autre chose à penser est le but des conseils de stationnaire. Si elles sont utiles sur votre site de bureau pour aider les utilisateurs à se renseigner sur l'endroit où ils se rendent sans avoir à investir un clic, pourquoi ne sont-ils pas utiles sur le site de votre appareil tactile? Je sais que hover est maladroit sur les appareils tactiles, mais je pense qu'ils sont assez communs car il n'y a pas encore d'alternative. Je parie que les utilisateurs d'appareils tactiles comprennent le flux. Le seul exemple qui vient à l'esprit est Seamless.com - lorsque vous sélectionnez un élément de menu dans un restaurant, vous obtenez une description de "hover", puis il faut un second clic pour sélectionner l'élément. Je me rends compte qu'il s'agit d'une vieille question - répondant pour les Googlers. :)

Answer 2

Un autre solution doit utiliser .mousemove() au lieu de .mouseover().

iOS ignore l'événement .mousemove() et déclenche un clic sur le premier contact.