vue-range-slider
vue-range-slider copied to clipboard
Scrollbar locked on mobile
Hi,
Is anyone experiencing scrollbar locked on mobile? Not sure what the problem is. No error on the console, have checked all css as well.
The issue is only on mobile browsers. Have tested on Safari iOS 13, Chrome on iOS and Android phones. The result is the same. The scrollbar is locked.
EDITED: I noticed modal on that page with form also is blocked.
Thank you in advance.
I'm also having this issue.
@devs - could this be resolved asap?
Thanks!
I get this error as well.. Is there a fix?
This component appears to hijack all touchmove (and mousemove) events for the whole containing document, calling e.preventDefault();
as its first order of business. That clobbers anything to do with touch for the rest of the page, which likely isn't what we want to happen.
I fixed it by modifying the move
function (that gets bound to that touchmove event on the document), so that it only calls preventDefault
if we're actually dragging the slider:
if (this.flag && this.dragFlag)
{
e.preventDefault();
if (this.stopPropagation)
{
e.stopPropagation();
}
}
This component appears to hijack all touchmove (and mousemove) events for the whole containing document, calling
e.preventDefault();
as its first order of business. That clobbers anything to do with touch for the rest of the page, which likely isn't what we want to happen.I fixed it by modifying the
move
function (that gets bound to that touchmove event on the document), so that it only callspreventDefault
if we're actually dragging the slider:if (this.flag && this.dragFlag) { e.preventDefault(); if (this.stopPropagation) { e.stopPropagation(); } }
Do you have a fork with this fix?
Do you have a fork with this fix?
No. I just changed my local copy.
Those few lines are the entire thing.
Is it possible that this is the same problem? https://i.gyazo.com/f70cee1c511e8b89ad0ddc83fd3312ed.mp4
я поменял атрибут "passive: true" с "passive: false" в функции
function addEvent(el, type, fn, capture) {
el.addEventListener(type, fn, {
passive: true,
capture: !!capture
});
}
И собственно все заработало. Либо можно пойти более длинным и сложным путем, меня отдельную логику для
addEvent(document, EVENT_TOUCH_MOVE, this._move);
Is there any solution to this problem without editing source code?
я поменял атрибут "passive: true" с "passive: false" в функции
function addEvent(el, type, fn, capture) { el.addEventListener(type, fn, { passive: true, capture: !!capture }); }
И собственно все заработало. Либо можно пойти более длинным и сложным путем, меня отдельную логику для
addEvent(document, EVENT_TOUCH_MOVE, this._move);
this works.
There is PR https://github.com/xwpongithub/vue-range-slider/pull/34 but it's not merged still ((