All Projects → moodysalem → react-fastclick

moodysalem / react-fastclick

Licence: MIT license
A react component that triggers click events for taps (short localized touches)

Programming Languages

javascript
184084 projects - #8 most used programming language

Projects that are alternatives of or similar to react-fastclick

Tap
1Kb library for easy unified handling of user interactions such as mouse, touch and pointer events.
Stars: ✭ 541 (+2605%)
Mutual labels:  tap, touch
gestures
A library for normalized events and gesture for desktop and mobile.
Stars: ✭ 31 (+55%)
Mutual labels:  tap, touch
Any Touch
👋 手势库, 按需2kb~5kb, 兼容PC / 移动端
Stars: ✭ 567 (+2735%)
Mutual labels:  tap, touch
Hover On Touch
A pure Javascript Plugin for an alternative hover function that works on mobile and desktop devices. It triggers a hover css class on »Taphold« and goes to a possible link on »Tap«. It works with all html elements.
Stars: ✭ 256 (+1180%)
Mutual labels:  tap, touch
React Cursor Position
A React component that decorates its children with mouse and touch coordinates relative to itself.
Stars: ✭ 136 (+580%)
Mutual labels:  tap, touch
Tape Run
Headless tape test runner
Stars: ✭ 221 (+1005%)
Mutual labels:  tap
Vue-music-
🎧Vue全家桶打造的QQ音乐
Stars: ✭ 51 (+155%)
Mutual labels:  fastclick
Homebrew Terraforms
Homebrew repository for a Terraform version switcher and all Terraform versions
Stars: ✭ 174 (+770%)
Mutual labels:  tap
Reflow
Content-routable socks5 proxy switcher for your entire LAN.
Stars: ✭ 170 (+750%)
Mutual labels:  tap
android-3d-model-viewer
Android app to load 3D models in obj, stl, dae & gltf format using pure OpenGL ES 2.0. Published on Play Store https://play.google.com/store/apps/details?id=org.andresoviedo.dddmodel2
Stars: ✭ 150 (+650%)
Mutual labels:  touch
fusuma-plugin-tap
Tap and Hold gestures plugin for Fusuma
Stars: ✭ 16 (-20%)
Mutual labels:  tap
karma-tap
Let your Karma tests to consume TAP output
Stars: ✭ 29 (+45%)
Mutual labels:  tap
Homebrew Command Not Found
🔍 Ubuntu’s command-not-found equivalent for Homebrew on macOS
Stars: ✭ 236 (+1080%)
Mutual labels:  tap
DebounceMonitoring
📑 Add debounce logic for any method in a single line.
Stars: ✭ 44 (+120%)
Mutual labels:  touch
Bats Core
Bash Automated Testing System
Stars: ✭ 2,820 (+14000%)
Mutual labels:  tap
homebrew-ecmascript
Homebrew formulae for ECMAScript engines
Stars: ✭ 13 (-35%)
Mutual labels:  tap
Rabtap
RabbitMQ wire tap and swiss army knife
Stars: ✭ 171 (+755%)
Mutual labels:  tap
Virtual Controllers
Virtual controls for use in Flash based games on touch devices. Includes thumbstick and button ui elements
Stars: ✭ 16 (-20%)
Mutual labels:  touch
react-pressure
React HOC that enables 3D Touch on other components, available via npm
Stars: ✭ 13 (-35%)
Mutual labels:  touch
homebrew-apple-fonts
Easily install Apples fonts using homebrew.
Stars: ✭ 12 (-40%)
Mutual labels:  tap

Build Status npm version react-fastclick

Wrapper <span/> that implements the FastClick logic in its touch events, triggering appropriate click and focus events on its children if it detects a 'tap'.

Install

npm install --save-dev react-fastclick-alt

Component Usage

Wrap your component in an instance of this component, and it should respond to short taps with immediate click events.

import React from 'react';
import FastClick from 'react-fastclick-alt';
import ReactDOM from 'react-dom';
ReactDOM.render(<FastClick><MyApp/></FastClick>, document.getElementById('app'));

Note this is safe to do even if child components also render react-fastclick-alt because a touchend event that triggers a click will not be propagated (i.e. event.stopPropagation() is called when a tap is detected)

Properties

There are two optional props to this component:

threshold (Number)

How far a touch can move before it can no longer be converted to a click, in px. Defaults to 15px.

timeThreshold (Number)

How long a tap can be held before it can no longer be converted to a click, in milliseconds. Defaults to 125ms.

Note that the project description data, including the texts, logos, images, and/or trademarks, for each open source project belongs to its rightful owner. If you wish to add or remove any projects, please contact us at [email protected].