Move-side Swipe events

problems with Zepto swipe under Android WebView

( you must refer to Touch.js when using Zepto's swipe, otherwise many mobile browser swipe will fail.) )

I want to use swipeleft/swiperight monitoring to the left and right to swipe the event, if it is simply to add an element Swipeleft/swiperight event WebView is not in force, if the page does not need to swipe up and down, it can be used completely

$ (' body '). Bind ("Touchmove", function (e) {     e.preventdefault ();});

Solve. That is, the touchmove default behavior of the body is canceled. But this is absolutely too violent, if the page needs to swipe up and down, then there will be a problem. Here are two things, the first is that an element in the page needs to swipe up and down, and the page needs to swipe up or down. In the first case, just one element in the page needs to swipe up and down, which can be used to listen for the Touchmove event and prevent bubbling. Like what:

$ (ID). bind ("Touchmove", function (e) {     e.stoppropagation ()});

So if the entire page needs to swipe up and down, all with touch (touchstart/touchmove/touchend) emulation (the swipe gesture I simulated under Android WebView does not trigger the Touchend event, I think this should also be zepto own package of swipe event failure reason, the idea is that when the user started sliding, to determine whether users want to swipe up or down or left and right, swipe up and down without doing processing, sliding left and right, on the Touchmove event Preventdefault () Operation. ）

jquery does not support swipe events, it is required to apply jquery mobile



Native JavaScript touch event, Touchstart,touchmove,touchend

There are three basic touch events that are listed in the specification and have been widely implemented across mobile devices:

1. Touchstart: Place your finger on a DOM element.
2. Touchmove: Drag a DOM element with your finger.
3. Touchend: Move the finger away from a DOM element.

Each touch event includes three touch lists:

1. Touches: A list of all the fingers that are currently on the screen.
2. Targettouches: A list of the fingers that are located on the current DOM element.
3. Changedtouches: A list of fingers that involve the current event.

For example, in a Touchend event, this would be a moving finger.

These lists consist of objects that contain touch information:

1. Identifier: A numeric value that uniquely identifies the current finger in a touch session.
2. The Target:dom element is the target of the action.
3. Client/page/screen coordinates: The position where the action takes place on the screen.
4. Radius coordinates and RotationAngle: Draw an ellipse roughly equivalent to the shape of a finger.

For example:
Document.body.addEventListener (' Touchmove ', function (event) {
Event.preventdefault ();
}, False);

Move-side Swipe events