Cauta rapid aici ↑

Cum sa activezi functia pentru vibrare pe dispozitivele mobile la un anumit eveniment

Activarea functiei pentru vibrare pe dispozitivele mobile este realizata de catre browser iar browser-ele care suporta Vibration API vor putea activa aceasta functie. Vibration API este prezent de mai mult timp iar atentia noastra trebuie sa se concentreze asupra obiectului navigator. Obiectul navigator detine mai multe metode si proprietati pe care le putem folosi. Nu este scopul acestui tutorial sa vi le prezint, voi le puteti vedea si testa daca veti scrie in consola browser-ului window.navigator sau doar simplu navigator urmat de caracterul punct ( . ) , caracter prin care browser-ul va va afisa un meniu drop-down cu metode si proprietati ale obiectului navigator. Incercati in browser-ul Chrome.

Metoda obiectului navigator care face sa vibreze dispozitivul mobil este vibrate() si va avea un singur parametru. Acest parametru reprezinta timpul de vibrare in milisecunde.

 navigator.vibrate(2500); 

In cazul in care un browser nu va avea implementat Vibration API, browser-ul respectiv va va arunca o eroare in consola. Din acest motiv va trebui sa testam existenta obiectului navigator, obiect ce este implentat odata cu Vibration API. Acest lucru il putem face ori cu ajutorul structurii conditionara if... else.

 if(!navigator){ console.log("Acest browser nu suporta Vibration API") } else{ navigator.vibrate(2500); } 

Liniile de cod de mai sus le putem folosi intr-o functie care va fi executata in momentul cand un eveniment (cel mai probabil click) va fi declansat pe un element din pagina. Exemplul pe care vreau sa vi-l arat este o continuare a tutorialului anterior. Va rog mai intai sa vizitati tutorialul → Cum sa personalizezi fiecare litera dintr-un titlu pentru anumite evenimente declansate de mouse ← si sa vedeti ce am facut in el si sa intelegeti logica si apoi sa reveniti in acesta. Mai jos am adaugat intreg codul pentru acest exemplu dar si exemplul live. Voua nu va mai ramane decat sa analizati intreg codul si sa testati pe dispozitivele voastre mobile pagina de dedesubt prin apasarea pe fiecare litera in parte.