Comprend les Événements Tactiles clientX/Y défilement ou pas?

J'essaie de toucher les coordonnées sont relatives à la fenêtre d'affichage de navigateur d'événements tactiles (comme évènements touchstart). J'ai essayé de les obtenir à partir de clientX/Y des propriétés, mais les deux en fait les valeurs de retour, y compris le défilement.

C'est contre spec, comme il est dit clientX/Y retourner coordonnées sans défilement.

  • J'ai essayé ajout/suppression d'une balise meta "viewport" - sans succès.
  • Je l'ai testé en iOS 4.3 pour iPhone et Fennec de nuit - à la fois les valeurs de retour avec défilement.

Ce que je fais mal?

Grâce

OriginalL'auteur kuvik | 2011-05-04

  1. 15

    Vous ne faites rien de mal. C'est un bug dans les anciennes versions de webkit qui se produisent lorsque la page défile. J'ai vu ce bug dans la version iOS4 et un autre bug sur Android 4.0.

    J'ai trouvé un moyen de détecter les bugs et calculer les valeurs correctes. J'espère que cela peut être utile pour les autres:

    function fixTouch (touch) {
    var winPageX = window.pageXOffset,
        winPageY = window.pageYOffset,
        x = touch.clientX,
        y = touch.clientY;

    if (touch.pageY === 0 && Math.floor(y) > Math.floor(touch.pageY) ||
        touch.pageX === 0 && Math.floor(x) > Math.floor(touch.pageX)) {
        //iOS4 clientX/clientY have the value that should have been
        //in pageX/pageY. While pageX/page/have the value 0
        x = x - winPageX;
        y = y - winPageY;
    } else if (y < (touch.pageY - winPageY) || x < (touch.pageX - winPageX) ) {
        //Some Android browsers have totally bogus values for clientX/Y
        //when scrolling/zooming a page. Detectable since clientX/clientY
        //should never be smaller than pageX/pageY minus page scroll
        x = touch.pageX - winPageX;
        y = touch.pageY - winPageY;
    }

    return {
        clientX:    x,
        clientY:    y
    };
}

    Cette fonction doit être appelée pour chaque contact dans l'événement.touche de tableau.

    OriginalL'auteur gregers

  2. 8

    Essayer cette

    event.touches[0].pageX

    Remarque que c'est toujours un événement.touche même si vous définissez votre événement comme celui-ci (à l'aide de jquery ici)

    $("body").bind('touchmove', function(e){ 
//stops normal scrolling with touch
e.preventDefault();

console.log(event.touches[0].pageX)

})

    ;

    La Guide de Safari fournit plus de détails

    Oui, je suis de la récupérer par événement.touche[0].clientX...mais je ne sais toujours pas pourquoi iOS (au moins) des rapports pageX et clientX comme même (en fait, ils doivent se distinguer par la fenêtre d'affichage offset)
    Vous avez raison, semble comme un bug. Vous pourriez hack autour d'elle en compensant le défilement de la page (event.targetTouches[0].screenY - $(window).scrollTop() )
    e.originalEvent.touche[0].clientY est de travailler pour moi

    OriginalL'auteur Thomas Brasington