Add Touch Events to Callbacks #269
Conversation
| @@ -464,14 +465,14 @@ class Rheostat extends React.Component { | |||
| this.setStartSlide(ev, ev.clientX, ev.clientY); | |||
|
|
|||
| if (typeof document.addEventListener === 'function') { | |||
| document.addEventListener('mousemove', this.handleMouseSlide, false); | |||
There was a problem hiding this comment.
what happens with this change in browsers that don't support passive event listeners?
|
Be interested to know how Airbnb solve vertical scrolling issues, seems they use the exact same component as open source, I checked their source. They stop vertical scroll of the page when the user is sliding the slider horizontally, but they also allow a vertical scroll of the page if the user touches the handle accidentally when scrolling vertically.
|
|
I think Airbnb stop vertical scrolling with touch (if the initial movement is horizontal) for the whole of their filters modal. @lightninglu10 I fixed it for my site doing |
This PR adds touchevents to the onSliderDragStart callback. This is useful so we can control touch events through rheostat.
An example would be blocking rheostat from scrolling vertically on mobile while it's dragging. Currently if a user uses our rheostat component on mobile, they can drag the slider and scroll the page at the same time.
Also added the current passive: false touch listeners to remove the warning from chrome.