Polub bloga na fejsie!

Hand.js – a jednak się da…

0

Mój mikro cykl o obsłudze ekranów dotykowych w JavaScript miał się zakończyć na poprzednim wpisie na ten temat, jednak szperając w google w poszukiwaniu materiałów do tych wpisów, natknąłem się na kilka JavaScriptowych bibliotek, które jak się okazuje pozwalają objeść problemy o których pisałem ostatnio. Postanowiłem więc, że fajnie będzie dopisać jeszcze jeden post na temat i opowiedzieć o jednej z takich właśnie bibliotek, a mianowicie Hand.js.

Przedstawiam Hand.js

Hand.js jest biblioteką, która powstała aby umożliwić pisanie kodu obsługującego ekrany dotykowe z użyciem zdarzeń wskaźnika czyli tych stworzonych przez Microsoft na potrzeby Internet Explorer. I rzeczywiście działa to fajnie… Ale może przejdźmy do przykładu – jak już pisałem w poprzednim wpisie, zdarzenia wskaźnika pomyślane zostały tak, by obsługiwać jednocześnie różne rodzaje wskaźników, w tym myszkę. Zatem spójrzmy najpierw na kod napisany pod zdarzenie „mousemove”:

Jak widać powyżej, mamy tutaj obiekt „canvas” na którym ruszając myszką możemy „rysować” – możecie sobie to przetestować w tym jsfiddle. Myślę, że przykład jest na tyle prosty, że nie muszę się wgryzać w jego szczegóły;)

Jeśli teraz zamienilibyśmy zdarzenie „mousemove” na „pointermove”, to taki kod będzie działał tylko w Internet Explorer 11 (zarówno dla myszki jak i dla innych rodzajów wskaźników). Dla porządku zmieniony kod HTML/JS:

No więc skoro taki kod nie działa w moim Firefoxie (ani w innych Operach i Safari), to co zrobić? Ano właśnie, wystarczy że podłączymy do naszego kodu skrypt Hand.js (do pobrania tutaj) i to tyle – zdarzenia wskaźnika grają i śpiewają! Zresztą możecie to sami sprawdzić w tym jsfiddle 😉

Podsumowanie

I to tyle – okazuje się, że ktoś miał takie same odczucia co do tej niekompatybilności co ja i postanowił temu zaradzić… Fajnie, że z dobrym skutkiem.

REACT, REDUX, REACT-ROUTER - KURSY ON-LINE

Chcesz od podstaw poznać tajniki React, Redux oraz react-router? Zapraszam do moich szkoleń on-line:

Przejdź do szkoleń

Uwaga! Obecnie trwa przedsprzedaż kursów - premiera 1 sierpnia 2017!

Google Analytics Alternative