Glisați pe dispozitive touch (javascript)

Deci, ce putem folosi pentru a determina încercarea utilizatorului de a produce pe senzorul de ecran o acțiune denumită în mod obișnuit o glisare. Folosind experienta noastra anterioara, putem determina evenimente senzoriale la senzor, precum si "swing" simultan cu un deget pe senzor.







De regulă, să clarificăm ce mișcare pe suprafața senzorului vom considera ca fiind o comandă. Această acțiune va fi implicat în două variabile, distanța parcursă de degetul pe x sau y axa, din momentul touchstart incidentului până la touchend, precum și momentul în care a luat această acțiune. Folosind aceste date, putem decide dacă utilizatorul a efectuat acțiunea despre care vorbim sau nu.

Prin studiu, putem determina valoarea medie, care are loc un deget pe senzor pentru această acțiune pe orizontală și pe verticală. În ceea ce privește mișcarea degetului orizontal, valorile distantelor sunt aproximativ aceleași, dar atunci când se deplasează de la stânga la dreapta, viteza este mult mai mare, de aproximativ 200 ms. În ceea ce privește mișcarea verticală a degetului este pe senzor, se recomandă să se determine cu condiția nu mai mult de 100px, astfel încât să nu interfereze cu alte comenzi, prin care, în acest caz, poate fi o problemă cu rezultate pozitive false.







Exemplu de determinare echipa «bețivan» de pe partea stanga spre dreapta (pentru dispozitivele care nu sunt echipate cu un senzor, ca în exemplul implementează un simulator pentru un mouse de calculator convențional).

Eveniment touchend vom verifica dacă distanța peste care a trecut un pointer la senzorul de la data evenimentului la touchstart touchend este un număr pozitiv este peste o valoare de prag predeterminată, în acest caz, 150. În același timp, ne ține departe de o posibilă mișcare verticală a cel puțin 100px. Deoarece mișcarea verticală a cursorului poate fi mai mare decât punctul de pornire sau mai mic, folosim Math.abs ().

Funcția generală de specificare a unei comenzi rapide.
În exemplul de mai sus, am analizat definiția comenzii de glisare de pe dispozitivele senzorilor în direcția din dreapta. În plus, puteți determina direcția cursorului la toate cele 4 laturi (dreapta, stânga, în sus și în jos).
Un exemplu de definire a unei comenzi de glisare în orice direcție (pentru dispozitivele care nu sunt echipate cu un senzor, exemplul acceptă cursorul obișnuit al mouse-ului).

Codul din definiția eșantionului "glisați" pe senzor în 4 direcții:

Asociază funcția swipedetect () pentru un bloc cu id # touchsurface2. Când apare acțiunea de glisare, imaginea de fundal a unității div este schimbată, indicând astfel direcția mișcării degetului.







Trimiteți-le prietenilor: