Touch punch on mobile devices with the jquery UI's touchscreen support | Jquery UI supports mobile touch-swipe, etc.

The jquery UI is a common UI front-end class library developed in our foreground, but the current jquery UI user interface class library does not support touch events on interactions and widgets. This means that the elegant UI you design on the desktop may not work on touch devices such as Ipad,iphone and Android. Because the jquery UI listens for Mouseover,mousemove and mouseout events, not touch events, touchstart,touchmove and touched.

To solve this problem, here we introduce the jquery UI Touch Punch class Library, which simulates events to match mouse events to Touch events. All you need to do is simply add the relevant class library. Very simple answer, easy to use.

Device Support

The JQuery UI touch Punch is perfectly compatible with touch events from the following devices.

• Ipad
• Iphone
• Android
• Other touch-based mobile devices

How to use

Continue with a few simple steps to achieve touch events on your mobile device.

1. Introduction of jquery and jquery UI plugin library files

<script src= "Http://code.jquery.com/jquery-1.7.2.min.js" ></script><script src= "/http Code.jquery.com/ui/1.8.21/jquery-ui.min.js "></script>

2. Introduction of JQuery UI Touch Punch class Library

Note: When you introduce the jquery UI Touch Punch class Library, be sure to place it behind the jquery UI and first invoke the jquery UI before the plugin can take effect.

<script src= "Jquery.ui.touch-punch.min.js" ></script>

3. At this point we have quoted the jquery UI touch punch plugin, so just follow the method call of the jquery UI and automatically support touch events on the mobile device.

<script>$ (' #widget '). Draggable ();</script>

This plugin does not have any parameters, just provides touch support for the jquery UI plugin, and if you often use the jquery UI and need to be compatible on a mobile device, then this plugin will certainly be available to you.

Friendly tip: Static resources Public Library http://www.bootcdn.cn/jqueryui-touch-punch/

Touch punch on mobile devices with the jquery UI's touchscreen support | Jquery UI supports mobile touch-swipe, etc.