Supporting touch – Mobile Web Development

Supporting touch – Mobile Web Development

So let’s dive in to supporting Touch Events, presuming that you really need to. Touch is supported across all major mobile browsers and Chrome, Firefox, and Opera on desktop as well. So touch has its own set of events, touch start, touch move, touch end, and touch cancel. These are somewhat analogous to the Mouse Events. Mouse down, mouse move and mouse up. Although Mouse Events have only one pointer. So the target element and coordinates of the Mouse Event are just on the event object. The Touch Events are multi touch. So there are three lists of touches on each touch event object. All the active touches All the Touches that are affecting the current DOM element and all the changedTouches. In each of these lists, each individual Touch is represented by an object that contains a unique identifier for the Touch, the coordinates of the Touch, and the target DOM element in the page. Although this is an important difference. Touch events are always delivered to the element that first received that Touch. They don’t walk across boundaries like Mouse Events do. So it’s important to hook the right elements. In fact, it’s a good idea to add the touchend handler during your touchstart handler. And, keep in mind too that even if you remove a DOM element from your tree, it still gets the events until the touch ends.

Be the first to comment

Leave a Reply

Your email address will not be published.