https://github.com/alekseykulikov/touch-action

Disable 300ms delay on mobile using CSS touch-action or asynchronously download FastClick as polyfill
https://github.com/alekseykulikov/touch-action

css fastclick polyfill

Last synced: 2 days ago
JSON representation

Disable 300ms delay on mobile using CSS touch-action or asynchronously download FastClick as polyfill

• Host: GitHub
• URL: https://github.com/alekseykulikov/touch-action
• Owner: alekseykulikov
• License: mit
• Created: 2016-02-18T11:59:36.000Z (over 8 years ago)
• Default Branch: master
• Last Pushed: 2016-02-22T02:21:17.000Z (over 8 years ago)
• Last Synced: 2024-11-08T22:46:53.851Z (6 days ago)
• Topics: css, fastclick, polyfill
• Language: JavaScript
• Homepage:
• Size: 10.7 KB
• Stars: 116
• Watchers: 6
• Forks: 2
• Open Issues: 1
• Metadata Files:
  • Readme: Readme.md
  • Changelog: History.md
  • License: LICENSE

Awesome Lists containing this project

README

        
# touch-action

> Disable 300ms delay on mobile using CSS touch-action or asynchronously download FastClick as polyfill.

[![](https://img.shields.io/npm/v/touch-action.svg)](https://npmjs.org/package/touch-action)

[CSS touch-action property](http://caniuse.com/#search=touch-action) allows eliminate the 300ms delay between a physical tap and the firing of a click event on mobile browsers. It's supported by all major browsers including Safari 9.3.

Therefore, there's no reason to always use [FastClick](https://github.com/ftlabs/fastclick) and include it to javascript bundle.

This library is just [17 lines of code](./index.js) and 14x smaller than FastClick (2.68Kb vs 0.2Kb). It checks support of CSS `touch-action`, and sets `touch-action: manipulation` to document body. When `touch-action` property is not supported, it asynchronously downloads [FastClick](https://github.com/ftlabs/fastclick) from CDN and use `FastClick.attach(document.body)` as polyfill.

This module is inspired by [gajus's gist](https://gist.github.com/gajus/bbf06ea2e37047b01e70).

## Installation

    npm install touch-action --save

    bower install touch-action

Standalone version available as [dist/touch-action.min.js](./dist/touch-action.min.js).

```html

window.touchAction()

```

## Example

```js

import touchAction from 'touch-action'

// use default behavior and download FastClick from CDN when needed

// https://cdnjs.cloudflare.com/ajax/libs/fastclick/1.0.6/fastclick.min.js

touchAction()

// use your own copy of FastClick

touchAction({ src: '/assets/fastclick.min.js' })

```

## touchAction(opts)

Init `touch-action` or download and attach `FastClick`.

Available options:

- `src` - custom path to fastclick (default: https://cdnjs.cloudflare.com/ajax/libs/fastclick/1.0.6/fastclick.min.js)

- `val` - specify [custom](https://developer.mozilla.org/en-US/docs/Web/CSS/touch-action) touch-action value, but be careful, since FastClick enables only `manipulation` (default: `manipulation`)

## License

[MIT]('./LICENSE')