Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

HammerJS.get() call seems to break vertical scrolling #7

Open
brandonballinger opened this issue Jun 13, 2015 · 13 comments
Open

HammerJS.get() call seems to break vertical scrolling #7

brandonballinger opened this issue Jun 13, 2015 · 13 comments

Comments

@brandonballinger
Copy link

If you have a content element that extends past the bottom of the screen and use WPTR, the user can no longer drag to scroll the page. I was able to isolate the problem to this call to HammerJS in init():
h.get( 'pan' ).set( { direction: Hammer.DIRECTION_VERTICAL } );

I tried commenting that line out, and everything else in WPTR seems to work just fine in my app. Happy to send you a PR to delete that line if you think there are no unintended side effects.

@hejun-lyne
Copy link

I have the same problem!
Thank you for pointing it out!

@apeatling
Copy link
Owner

This seems to break things on iOS Safari, were you testing a desktop browser? Seems to work there.

@brandonballinger
Copy link
Author

This was with an iOS WKWebView (which, in theory, should have the same behavior as iOS Safari) and Chrome desktop.

IIRC, it did break horizontal scrolling, so I ended up overriding the HammerJS touchAction setting. If it's helpful, here's the initialization code I've been using for the last couple of months:

var WebPullToRefresh = require('wptr');
Hammer.defaults.touchAction = 'auto'; // re-enable browser default scrolling
WebPullToRefresh.init({
  loadingFunction: () => {
    return new Promise((resolve, reject) => {
      this.refreshSong({}, (err) => !!err ? reject() : resolve())
    });
  }
});

@brandonballinger
Copy link
Author

(My memory may be a little hazy—I've been using wptr for the last couple of months and it's been doing it's job pretty well in our little app!)

@1updesign
Copy link

this fixed the problem for me - thanks

@jlft
Copy link

jlft commented Oct 2, 2015

Unfortunately, both of this solutions (commenting the line and/or adding the new init code) get native vertical touch scrolling to work (good!) but break the pull to refresh, in iOS Safari and Chrome. So far, I'm still unable to get the pull to refresh to work with native touch scrolling.

@felquis
Copy link

felquis commented Dec 21, 2015

Same of @jlft here

@shmdhussain
Copy link

In Android and iOS , same demo as in Github with more content on the page (more than layout viewport height) stops vertical scrolling of the page

@taylorjames
Copy link

I am having the same issue, any progress @apeatling ?

@YZahringer
Copy link

Same issue, scroll not working after wptr init on some devices....

@Aetiranos
Copy link

For me, this simple one liner fixed everything that was breaking the scrolling on iPhone 6 (9.3.2). Find the instantiation of the Hammer object and append another parameter to reset the touchAction (line 65 in wptr.1.1.js).

var h = new Hammer( options.contentEl, { touchAction: 'auto' });

@YZahringer
Copy link

@Aetiranos Thank's, this solves the problem of the scroll is not working on some devices.

The scroll works on Windows Mobile 10, but not the refresh...

@WilliamIsted
Copy link

@Aetiranos's solution fixes an issue with iOS 8.4 where the ptr container would not scroll on focus, but would scroll if you focused on the overflow of the container (super weird).

WilliamIsted added a commit to WilliamIsted/web-pull-to-refresh that referenced this issue Dec 20, 2016
This line fixes an issue with iOS 8.4 and reportedly iOS 9.3.2 where the ptr scroll container can not be scrolled downwards, only up to refresh. Thanks to @Aetiranos apeatling#7 (comment)
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests