Home > Developer > Web Develop
touch.js--Common Application Actions
Basic events:
Touchstart//trigger when finger just touches the screen
Touchmove//trigger when the finger moves on the screen
Touchend//trigger when the finger moves away from the screen
Touchcancel//Touch process is triggered when the system is canceled (less)
I. Event binding (common, important)Touch.on (element, types, callback);
function Description : Event binding method, which distinguishes between event bindings and event proxies based on parameters.
parameter Description :
| Parameters | type | Description |
|---|---|---|
| Element | Element or string | Element Object, Selector |
| Types | String | The type of event (most of which is a gesture event), which can accept multiple events separated by spaces; support for the transmission of native events |
| Callback | function | The event handler function, the Remove function and the binding function must be the same reference; |
Partial gesture Events
| category | Parameters | Description |
|---|---|---|
| Scaling | Pinchstart | Zoom gesture Start |
| Pinchend | Zoom gesture End Point | |
| Pinch | Zoom gesture | |
| Pinchin | Contraction | |
| Pinchout | Amplification | |
| Rotating | Rotateleft | Rotate Left |
| Rotateright | Rotate Right | |
| Rotate | Rotating | |
| Sliding | Swipestart | Swipe gesture start |
| Swiping | Slide in | |
| Swipeend | Swipe gesture end point | |
| Swipeleft | Swipe left | |
| Swiperight | Swipe right | |
| Swipeup | Swipe up | |
| Swipedown | Swipe down | |
| Swipe | Sliding | |
| Drag to start | DragStart | Drag the screen |
| Drag | Drag | Drag gestures |
| Drag End | Dragend | Drag the screen |
| Drag | Drag | Drag gestures |
| Long Press | Hold | Long Press the screen |
| Rap | Tap | Click the screen |
| Doubletap | Double-click Screen |
Partial event handler function
| Properties | Description |
|---|---|
| Originevent | Triggers the native object of an event |
| Type | The name of the event |
| Rotation | Rotation angle |
| Scale | Zoom ratio |
| Direction | Direction properties of the operation |
| Fingerscount | Number of gestures to manipulate |
| Position | Relevant location information, different operations to produce different location information |
| Distance | Displacement between two points of the swipe class |
| Distancex, X | The displacement value in the X direction of the gesture event, negative when moving to the left |
| Distancey, Y | The displacement value in the Y direction of the gesture event, negative when moving up |
| Angle | Rotate the angle of rotation when the event is triggered |
| Duration | Timestamp between Touchstart and Touchend |
| Factor | Swipe event acceleration factor |
| Startrotate | Initiates a single-finger rotation method that is invoked when an element's Touchstart is triggered |
Small test Sledgehammer:
Public
"Rotary rotate
"Sliding Swiper
" Drag drag
Click Tap, Double-click Doubletap, press and hold
Touch.on (' #target ', ' Hold tap Doubletap ', function (EV) { }//multiple gestures with the same effect, separated by a space
Events, including mouse events, occur in the following order:
(1) Touchstart
(2) MouseOver
(3) MouseMove (one time)
(4) MouseDown
(5) MouseUp
(6) Click
(7) Touchend
touch.js--Common Application Actions
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
