Comportamento corretto del pulsante di tocco per MobileSafari

Question

In genere, MobileSafari ha un comportamento errato del pulsante HTML (significato non corretto: "non come un pulsante nativo iOS"). comportamento del pulsante corretta è la seguente: tocca

• utente pulsante: Button mette in evidenza
• utente trascina il dito fuori del tasto: Tasto attenua
• utente trascina il dito di nuovo nel pulsante: mette in evidenza Button
• utente trascina dito di tasto e rilascia: pulsante non cliccare

pulsanti MobileSafari evidenziare quando si toccano, stare evidenziato non importa whe si sposta e si fa clic indipendentemente dal punto in cui vengono rilasciati (a meno che la vista non scorra, nel qual caso il tocco viene sempre annullato, anche se si reinserisce il pulsante).

Questo problema si applica a tutti gli elementi selezionabili come i collegamenti (quando -webkit-touch-callout è impostato su none). Ho trovato finora solo un'applicazione web che ha un comportamento corretto dei pulsanti: Facebook. Guardando il loro codice per questo, sembra che abbiano fatto un bel po 'di salti mortali per farlo funzionare correttamente (tenendo traccia di tutti gli eventi del mouse manualmente e non usando affatto i pulsanti). Il codice è denso, utilizza Javelin e non sono ancora chiaro su tutti i pezzi necessari per farlo funzionare.

So che sto scherzando (se fosse facile, lo farebbero tutti), ma lo chiederò comunque. Esiste una parte di codice generalmente disponibile che gestisce questa funzione? Esiste una soluzione più semplice rispetto al reverse engineering Javelin, anche se è applicabile solo a WebKit? (Il giavellotto non è molto adatto alle mie esigenze leggere.) Il mio obiettivo finale è il comportamento corretto dei pulsanti per un UIWebView incorporato in un'app nativa, quindi anche le soluzioni ibride JavaScript/ObjC sono accettabili (sebbene non vengano in mente approcci ibridi) .

Answer 1

Fondamentalmente ciò che si vorrebbe fare è creare una sorta di funzionalità ibrida con il passaggio del mouse con il punto di controllo per i dispositivi touch, che rileva quando il dito si sposta all'interno o all'esterno del pulsante in questione.

Ho creato un JSFiddle di base che implementa alcune funzionalità barebone. Se conosci qualche javascript, penso che ti verrà l'idea.

Live JSFiddle DEMO

provarlo sul vostro dispositivo iOS (e forse il tuo dispositivo Android ??).

- brian