Wydarzenia dotykowe

Zdarzenia dotykowe Możliwe jest tworzenie aplikacji obsługujących dotyk, które działają na wielu urządzeniach mobilnych Przeglądarki desktopowe z obsługą dotyku są już prawie dostępne; przygotuj się teraz Po raz pierwszy pojawiły się w mobilnym Safari dla iOS 2.0 Cztery podstawowe zdarzenia: touchstart touchmove touchend touchcancel Pola obiektu zdarzenia: touches targetTouches changedTouches klawisze modyfikujące (shift, alt, ctrl, meta) Pola obiektu dotyku: identifier clientX/Y pageX/Y screenX/Y Obecnie są to robocze projekty W3C Nadal istnieje wiele różnic między dostawcami: touchenter / touchleave ( Firefox , Blackberry ) gesturestart / gesturechange / gestureend (mobilne Safari) MSPointer* / MSGesture* (IE10) Zachowanie zbliżone do natywnego Urządzenia z alternatywnymi metodami wprowadzania danych Obsługa wielodotykowa FF6+ obsługuje zdarzenia dotykowe w stylu W3C IE10 obsługuje MSPointer* / MSGesture* Brak obsługi w WebKit Wyłączenie standardowej obsługi gestów (przesuwanie / powiększanie / przewijanie) oraz document.body.addEventListener(‘touchmove’, function(event) { event.preventDefault(); }, false); Wyłączenie standardowej obsługi gestów (przesuwanie / powiększanie / przewijanie) Obsługa renderowania w pętli: var touches = [], // tutaj można również użyć requestAnimationFrame() renderLoop = setInterval(function() { draw(touches); // wywołanie naszej funkcji rysującej }, 15); myElement.addEventListener(‘touchmove’, function(e) { touches = e.touches; }, false); Wyłączenie standardowej obsługi gestów (przesuwanie / powiększanie / przewijanie) Obsługa renderowania w pętli Obsługa urządzeń z pojedynczym dotykiem (np. telefony z Androidem) Wyłączenie standardowej obsługi gestów (przesuwanie / powiększanie / przewijanie) Obsługa renderowania w pętli Obsługa urządzeń z pojedynczym dotykiem (np. telefony z Androidem) Obsługa zdarzeń myszy dla: Telefonów z fizycznym urządzeniem wskazującym (np. wiele telefonów z Androidem) Telefonów bez obsługi zdarzeń dotykowych (np. Windows Phone 7) Przeglądarki desktopowe bez obsługi dotyku (np. Chrome) Wyłączenie standardowej obsługi gestów (przesuwanie / powiększanie / przewijanie) Obsługa renderowania w pętli Obsługa urządzeń z pojedynczym dotykiem (np. telefony z Androidem) Obsługa zdarzeń myszy Obsługa przeglądarek desktopowych z obsługą dotyku: Firefox (zdarzenia dotykowe w stylu W3C) IE10 (MSPointer*) @ @ggoodale