{"id":25393625,"url":"https://github.com/xd-tayde/mtouch","last_synced_at":"2025-10-30T19:30:44.727Z","repository":{"id":57304681,"uuid":"97821247","full_name":"xd-tayde/mtouch","owner":"xd-tayde","description":"移动端手势库","archived":false,"fork":false,"pushed_at":"2019-03-19T01:12:47.000Z","size":185,"stargazers_count":61,"open_issues_count":1,"forks_count":12,"subscribers_count":6,"default_branch":"master","last_synced_at":"2025-02-10T08:19:22.587Z","etag":null,"topics":["drag","finger","gesture","hammer","mtouch","pinch","rotate","singlepinch","singlerotate","sticker","touch"],"latest_commit_sha":null,"homepage":"http://f2er.meitu.com/gxd/mtouch/example/index.html","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/xd-tayde.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2017-07-20T10:12:25.000Z","updated_at":"2023-05-17T03:18:57.000Z","dependencies_parsed_at":"2022-09-09T06:12:41.989Z","dependency_job_id":null,"html_url":"https://github.com/xd-tayde/mtouch","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/xd-tayde%2Fmtouch","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/xd-tayde%2Fmtouch/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/xd-tayde%2Fmtouch/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/xd-tayde%2Fmtouch/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/xd-tayde","download_url":"https://codeload.github.com/xd-tayde/mtouch/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":239032245,"owners_count":19570770,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["drag","finger","gesture","hammer","mtouch","pinch","rotate","singlepinch","singlerotate","sticker","touch"],"created_at":"2025-02-15T18:08:47.378Z","updated_at":"2025-10-30T19:30:37.246Z","avatar_url":"https://github.com/xd-tayde.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# MTouch.js\n\n\u003e [demo](http://f2er.meitu.com/gxd/mtouch/example/index.html)\n\n\u003e [github](https://github.com/xd-tayde/mtouch)\n\n### Introduction\n\n**[中文版](./README_ZH.md)**\n\nMTouch is a modern JavaScript mobile touch gesture library. It's simple, convenient and only 9k.\n\nThe library support 5 kinds of gesture.\n\n- drag\n- pinch\n- rotate\n- **singlePinch**\n- **singleRotate**\n\n\u003e Tips:Single finger operation is so useful as practice confirms.\n\n### event\n\nall the event you can bind:\n\n```js\nEVENT = [\n    'touchstart',\n    'touchmove',\n    'touchend',\n    'drag',\n    'dragstart',\n    'dragend',\n    'pinch',\n    'pinchstart',\n    'pinchend',\n    'rotate',\n    'rotatestart',\n    'rotatend',\n    'singlePinch',\n    'singlePinchstart',\n    'singlePinchend',\n    'singleRotate',·\n    'singleRotatestart',\n    'singleRotatend'\n];\n```\n\n### Installation\n\n- You can download the latest version from the [GitHub](https://github.com/xd-tayde/mtouch/blob/master/dist/mtouch.min.js);\n\n- use a npm [CDN](https://unpkg.com/mtouch@3.0.4/dist/mtouch.min.js).\n\n- or install via npm:\n\n```js\n\tnpm install mtouch --save\n```\n\n### Basic usage\n\n```js\nlet mt = new MTouch(selector);\n// bind the drag event；\nmt.on('drag',e =\u003e {\n\n});\n\n// bind the singlePinch. but there must be a operator that is the element which you want to operate;\nmt.on('singlePinch', e =\u003e{\n\n} , operator);\n\n```\n\n### Example\n\nYou can operate the element via the `ev.delta`(incremental motion) in callback's params;\n\n```js\n// the global transform to store the state of ele;\nlet transform = {\n    x:0,\n    y:0,\n    scale:1,\n    rotate:0\n}\n\nMTouch('selector', ev =\u003e {\n   transform.x += ev.deltaX;\n        transform.y += ev.deltaY;\n\n    $(el).css('transform',\n            `translate3d(${transform.x}px,${transform.y}px,0px) scale(${transform.scale}) rotate(${transform.rotate}deg)`);\n});\n\n```\n\n### API\n\n#### 1.`switch`\n\n`mtouch.switch(el,addButton)`;\n\nSwitch the operator to change the basepoint that will be used in singlePinch or singleRotate's calculation.\n\nparams:\n\n\t// the element want to operate;\n\tel: type: string or HTMLElement,\n\t\toptional;\n\t\tdefault: the el on create the instance;\n\n\n\t// whether you want to add a button when use single gesture.\n\taddButton: type: boolean,\n\t\t\t\t optional,\n\t\t\t\t default:true;\n\n#### 2.`on/off`\n\n`mtouch.on(evName,handle,operator) / mtouch.off(evName,handler)`;\n\nbind the event callback;\n\n```js\nmtouch.on('drag',(ev)=\u003e{\n    console.log(ev);\n})\n```\n\nthe ev of callback is:\n\n```js\nev = {\n\torigin:TouchEvent,\n\teventType:'drag',\n\tdelta:{\n\t\tdeltaX : 1,\n\t\tdeltaY : 1,\n\t}\n}\n\n```\n\n#### 3.`destroy`\n\n`mtouch.destroy()`;\n\nunbind all the event that has band on el;\n\n### License\n\n[MIT](https://opensource.org/licenses/MIT)\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fxd-tayde%2Fmtouch","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fxd-tayde%2Fmtouch","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fxd-tayde%2Fmtouch/lists"}