11
votes

IOS 5 (Safari) bug avec des événements touch html sur "Position: fixe" div

J'ai une position: fixe div sur une page Web défilante.

Au début, l'événement fonctionne, mais lorsque la page Faites défiler la page, tandis que la zone DIVS Fixeed reste en place, sa zone "touch" semble changer (il semble que Pour faire défiler - sauf sur le dessus d'un autre div, ou en fonction de la mise en page de la page ...). Finalement, aucun événement tactile n'est reçu plus si vous faites défiler trop. Parfois, la DIV sous-jacente reçoit l'événement à la place.

Voici l'échantillon: xxx

lorsque vous faites défiler assez et touchez le rouge "fixe" Sur son côté gauche, rien ne se passe (pas d'alerte). Cependant, du côté droit (au-dessus de la division verte div), cela fonctionne ...?!

ressemble à un bug safari pour moi. Avez-vous l'expérience de la même chose? Une idée pour une solution de contournement? (L'iScroll est hors de question - trop lent)

Merci, LC


3 commentaires

Avez-vous déposé un rapport de bogue ?


merci, maintenant je l'ai fait (Bug ID # 10675212)


Avez-vous déjà trouvé une solution?


7 Réponses :


1
votes

J'ai eu ce problème. La façon dont je me suis arrondi était de se lier à "cliquer sur" au lieu de "touchstart".

Ceci signifiait que mes événements "clic" ont été gâchés (pour les utilisateurs qui ne sont pas sur des périphériques tactiles), j'ai donc détecté une survolée d'abord, puis a utilisé le vol stationnaire pour me dire s'il s'agissait d'utilisateurs ou non. Un peu sale, mais ça marche!


0 commentaires

2
votes

J'ai le même problème. Il semble s'agir d'un problème d'index Z, lorsque les divs sont déplacés par programmation (avec des animations, etc.): La DIV en position fixe ne fonctionne pas correctement car l'utilisateur ne touche pas à nouveau pour faire défiler. Seulement dans ce dernier cas, les divs semblent être recalculés correctement.


0 commentaires

1
votes

J'ai trouvé ce bug aussi, mais celui ci-dessous semblait éclaircir pour moi: xxx

ajoutez-le à votre en-tête HTML


1 commentaires

Bien que ce soit une question IOS: cela ne fonctionne pas non plus sur Android, non plus.



1
votes

J'ai rencontré le même problème à l'aide d'une navigation de position fixe qui fait défiler l'utilisateur autour de la page en utilisant l'animation de JQuery. Je ne crois pas que ce soit un problème de z-index. Ce que j'ai trouvé, c'est que lorsque l'animation déplace la fenêtre, l'élément de position fixe est toujours toujours à l'emplacement précédent jusqu'à ce que l'utilisateur touche et déplace l'écran. À ce stade, la position de la valeur liquidative est mise à jour. Plus d'informations et de démo ici: http://bit.ly/ios5fixedbug


0 commentaires

12
votes

J'ai trouvé une solution relativement étrange à ce bogue. En ajoutant un écouteur d'événements Touchstart et un gestionnaire d'événements vierge, il semble en quelque sorte déplacer la zone tactile sur le toucher manuel. Je ne sais pas si c'est une solution pour le problème de défilement JavaScript.

Code: P>

document.getElementsByTagName("body")[0].addEventListener("touchstart",function(){});


5 commentaires

Cela a fonctionné pour moi. J'avais un problème dans lequel un élément fixe ne recevait pas d'événements tactiles lorsque la page faisait défiler la page. Fixé!


De même, j'avais une divigne de manière programmatique avec des balises d'ancrage sous elle. Le DIV ne recevait pas les événements tactiles mais les ancres étaient. La mise en œuvre de la solution ci-dessus a fonctionné pour moi.


Le code a une légère erreur de syntaxe. Il devrait être: document.getelementsbytagname ("corps") [0] .addeventlistener ("T OCHSTART", fonction () {});


Ce code, avec le ajouté [0] , a fonctionné pour moi sur iOS 5, iPod Touch


Je ne peux pas croire que ça fonctionnait! Je devais l'ajouter à la position : élément fixe , pas le corps, BTW.



0
votes

Ce problème peut être lié à un autre qui a posté quelques solutions de contournement. La mise en œuvre du positionnement fixe sur la safari mobile est au mieux au mieux.

Position fixe NAVBAR cliquable uniquement une fois dans Safari mobile sur iOS5


0 commentaires

0
votes

Evénements tactiles Récupérer PageX et la page - qui suggère une position sur la "page" est signifiée. Si la page est défilée, la coordonnée Y augmente et donc les éléments fixes seront hors de portée car leurs valeurs de compensation Y restent identiques. Vous pouvez vérifier si un élément fixe a été touché sur une page défilée par ce calcul: xxx

Si vous avez le défilement horizontal, vous devez faire la même chose avec la coordonnée X, bien sûr.


0 commentaires