After applying dragend, touch devices' native scrolling up/down is gone

[ianthedev]

On touch devices, after applying dragend, we can no longer scroll up/down each dragend page's content (when content is longer than screen height).

[siamkreative]

+:100:

The Mobile demo is affected. Can't scroll down... I'm switching back to SwipeJS for this reason but I'll regularly check if dragend gets updated.

[Stereobit]

And I promise that I'll work on this. Sometime :-)

[mikehuebner]

Any update on this? Trying to get this to work for me as well I haven't come up with much yet. Trying to see what direction the pages pick up and its strictly left and right. Never got a single up or down on the direction.

[jamealg]

I was able to mitigate this issue by commenting out "event.preventDefault()" in the onMove method. It's not the best solution but it works.

[siamkreative]

@Ian-Y @jamealg I have found another JavaScript slider (also library agnostic) that works best and seems to be more maintained: https://github.com/wilddeer/Peppermint

[ianthedev]

@SiamKreative Thank you very much!

[intsfanatic]

I sort of found a solution, there are 2 dragend.js files, the one in the root directory and second is in the dist folder. Both of them have their issues. The first one has scrolling issue fixed, but left/right arrows do not work properly and the second one has just the scrolling issue. So what i did was, i just copied the updated code in _onMove function from the first file into the second file. Swiping on windows phone becomes nearly impossible to achieve (you can always add arrows), but android and IOS seemed to work fine. This is how my onMove function looks like in dragend.js file

_onMove: function( event ) {

    event = event.originalEvent || event;

    // Fix mobile vertical scrolling, credits go to ptisdel
    var coords = getCoords(event),
    x = this.startCoords.x - coords.x,
    y = this.startCoords.y - coords.y;
    if (Math.abs(y) > Math.abs(x)) return;

    // ensure swiping with one touch and not pinching
    if ( event.touches && event.touches.length > 1 || event.scale && event.scale !== 1) return;

    if (this.settings.disableScroll) event.preventDefault();

    if (this.settings.stopPropagation) {
      event.stopPropagation();
    }

    var parsedEvent = this._parseEvent(event),
        coordinates = this._checkOverscroll( parsedEvent.direction , - parsedEvent.distanceX, - parsedEvent.distanceY );

    this.settings.onDrag.call( this, this.activeElement, parsedEvent, coordinates.overscroll, event );

    if ( !this.preventScroll ) {
      this._scroll( coordinates );
    }
  },