web-dev-qa-db-fra.com

Est-ce que css hover fonctionne sur les appareils mobiles?

Est-ce que css hover fonctionne sur les appareils mobiles? J'ai une classe de vol stationnaire css qui fonctionne bien sur un navigateur Web classique, mais ne fonctionne pas sur les navigateurs mobiles.

57
Sam

La pseudo-classe :hover nécessite un périphérique de pointage (entrée graphique), capable de distinguer les actions pointage et sélection/activation. Habituellement, sur les appareils mobiles dotés d'une interface tactile, vous ne disposez pas du premier, mais du dernier. De plus, certaines interfaces du stylet ne permettent que l'activation, pas le pointage.

La pseudo-classe :hover s'applique tant que l'utilisateur désigne un élément (avec un périphérique de pointage), mais ne l'active pas. Par exemple, un agent d'utilisateur visuel peut appliquer cette pseudo-classe lorsque le curseur (pointeur de la souris) survole une zone générée par l'élément. Les agents utilisateurs ne prenant pas en charge les médias interactifs ne doivent pas nécessairement prendre en charge cette pseudo-classe. Certains agents utilisateurs conformes prenant en charge les médias interactifs risquent de ne pas être en mesure de prendre en charge cette pseudo-classe (par exemple, un stylo).

- W3C: CSS 2.1: Sélecteurs, pseudo-classes dynamiques

Donc, pour répondre à votre question: cela dépend de l'appareil mais probablement pas. Et ne comptez pas dessus. Avec les appareils à écran tactile qui gagnent rapidement en popularité, vous perdrez la totalité des événements de pointage uniquement.

33
Joey

Soupir. Il semble que personne ne répondant à cette question ne l’ait réellement essayé sur un vrai appareil. Dans de nombreux cas, cela fonctionne. Le premier clic agit comme un survol.

Quelques informations supplémentaires ici: http://designshack.net/articles/css/are-hover-events-extinct/

24
Andy Baker

Non, sauf si l'appareil peut détecter le moment où quelqu'un pointe son doigt sur l'écran, sur le point de taper. :)

7
Nathan Long

Qu'est-ce que le questionneur veut dire par "Est-ce que le survol de CSS fonctionne sur les appareils mobiles?"? 

De toute évidence, il ne le dit pas littéralement, car il n’existe pas de vol stationnaire sur les appareils mobiles, donc cela ne peut pas fonctionner.

S'il veut dire "Sur les appareils mobiles, si je tape sur un objet avec un style de survol, quelque chose se passe-t-il?" la réponse est oui, mais ce qui se passe varie en fonction du périphérique/navigateur. 

Spécifiquement sur iPhone/Safari et Android, la réponse est comme si vous aviez écrit un gestionnaire d’événements OnClick () avec le changement de style, et cela persiste jusqu’à ce que vous tapotiez sur un autre objet. Sur Windows Phone, le style change lorsque vous appuyez sur votre doigt, puis revient lorsque vous le relâchez.

Vous pouvez vérifier votre appareil sur le site de test que j’ai configuré à l’adresse davidleader.net/mobiledemo.html .

7
David

Cela dépend du navigateur utilisé sur le périphérique mobile. Reportez-vous à Mode Quirks pour les appareils mobiles et voyez si votre navigateur/votre plate-forme le mettra en œuvre.

3
Digicoder

De ma propre expérience, cela fonctionne très bien sur mon iphone4, quel que soit le navigateur (safari ou chrome), mais ne fonctionne pas correctement sur mon nexus10 avec chrome ...

J'ai utilisé: survoler pour mettre en œuvre le menu. Quand je dis "ça marche", je veux dire que la première touche se comporte comme un survol sur un bureau, et une deuxième touche se comportera comme un clic . se comporte comme un clic directement ...

2
dajam

Je dirais non, car vous ne passez pas votre temps dans une interface mobile. Vous pouvez simplement appuyer sur, si sur l'écran tactile. Sinon, il vous suffit de vous déplacer dans les liens.

0
Dustin Laine

fonctionne également pour les appareils BlackBerry Storm 1 car ils ont des contacts tactiles et des événements de clic grâce à leurs écrans suedo-tactiles 

0
rlemon

ne fera pas sa magie sur les appareils à écran tactile, mais cela fonctionne sur les mobiles où l'utilisateur navigue en utilisant des touches de direction (ou sur le Kindle d'Amazon)

0
silverskater

: survol fonctionne avec le navigateur par défaut Android, mais il est vraiment difficile (pour l'utilisateur) de déclencher le survol sans déclencher un clic en même temps. 

0
peq