Acest Javascript de 500 de octeți poate prezice mișcările cursorului utilizatorului
Puteți face unele lucruri foarte interesante cu JavaScript, iar codul open source face munca chiar mai ușoară.
Premonish este una dintre cele mai bune biblioteci pe care le-am văzut și pe care le-am construit doar 500 de octeți de JavaScript. Cu ajutorul acestui plugin, puteți detecta în cazul în care mouse-ul utilizatorului se mișcă și prezice la care element se îndreaptă.
Acest lucru poate părea o idee complexă, dar este destul de ușor de implementat. Să nu mai vorbim de acest lucru tonă de oportunitate pentru dezvoltatori de a crea unele efecte foarte reci, cum ar fi animații pre-hover sau dinamic efecte de aspect.
Începeți care vizează un element pe pagina și definind modul în care va arăta când utilizatorul se îndreaptă spre acel element.
Toate calculele se fac pe backend cu biblioteca Premonish, deci nu trebuie să vă faceți griji în legătură cu matematica sau logica din spatele acestei.
În schimb, căutați o cale gestiona predicția pe baza unui clasament de încredere al comportamentului utilizatorului. Toate acestea sunt transmise în JavaScript, pentru a vă putea scrie propriile funcții gestiona comportamentele utilizatorilor.
Iată un exemplu fragment din demonstrația Premonish:
premonish.onIntent ((el, confidențialitate) => // el este elementul DOM așteptat // încrederea este un scor de la 0-1 la cât de încrezător suntem în această predicție.);
onIntent () metoda este coaptă în Premoniș și se numește ori de câte ori biblioteca observă un utilizator care se deplasează către un element.
Puteți utiliza și altă metodă, onmousemove (), care rulează de fiecare dată cursorul modifică pozițiile X / Y pe ecran. În acest fel, puteți vedea cum Premonish calculează cotele de intenție ale utilizatorilor.
Puteți găsi o grămadă de informații în principalul replică GitHub, care include fragmente de cod simple pentru a începe. Inițializarea necesită doar o serie de selectori sau elemente DOM care ar trebui să fie vizate.
Modul în care utilizați acest plugin depinde în totalitate de dvs. Aceasta nu este o soluție completă, ci mai degrabă un punct de plecare pentru a vă ajuta presupune intențiile utilizatorului și să construim o experiență în acest domeniu.
Check out live demo pentru a vedea cum funcționează toate acestea și pentru a vedea a “modul de depanare” unde puteți urmări modul în care algoritmul de predicție funcționează în timp real.
De asemenea, puteți să vă împărtășiți gândurile și să le mulțumiți creatorului Matthew Conlen pe Twitter @mathisonian.
