Skip to content

Instantly share code, notes, and snippets.

@hotmeteor
Created March 29, 2012 00:55
Show Gist options
  • Save hotmeteor/2231984 to your computer and use it in GitHub Desktop.
Save hotmeteor/2231984 to your computer and use it in GitHub Desktop.
Allow vertical scrolling on a horizontal iScroll (touch only)
var point, pointStartX, pointStartY, deltaX, deltaY;
var scroller = new iScroll('scrollerId', {
vScroll: false,
vScrollbar: false,
hScrollbar: false,
snap: 'li',
momentum: false,
onBeforeScrollStart: function(e) {
point = e.touches[0];
pointStartX = point.pageX;
pointStartY = point.pageY;
null;
},
onBeforeScrollMove: function(e) {
deltaX = Math.abs(point.pageX - pointStartX);
deltaY = Math.abs(point.pageY - pointStartY);
if (deltaX >= deltaY) {
e.preventDefault();
} else {
null;
}
}
});
@gnanasuriyan
Copy link

Thanks. This solution helped me to resolve lot of problems related snapping.

@pabloweinx
Copy link

Hi, my friends.

Could you share with me an aproximation adapted to iScroll 5? My problem is "scroll" event doesn't allow to receive the "e" param, and with the renamed event "beforeScrollStart", I can't determine the real direction because in this event these values are always 0,0.
I can get the real direction only on "scroll" and "scrollEnd" events, but I can't stop the propagation or prevent the default behaviour of the scrolling, so when my finger try to move the page in vertical direction, as It's formed of various iScrollers, I only get by clicking on a non-iScolll zone.

Thanks so much!

@bilelz
Copy link

bilelz commented May 8, 2014

hello
i found a native solution to allow vertical scroll with iScroll 5 : http://lab.cubiq.org/iscroll5/demos/event-passthrough/
source code :

myScroll = new IScroll('#wrapper', { eventPassthrough: true, scrollX: true, scrollY: false, preventDefault: false });

from : http://cubiq.org/iscroll-5-ready-for-beta-test

@MattOpen
Copy link

MattOpen commented Aug 6, 2014

@bilelz, works great in V.5
Thank you

@igolka97
Copy link

@bilelz Thanks!!! Works great with 5.0

@mzammouri
Copy link

@bilelz Thanks

@huanggm
Copy link

huanggm commented Mar 23, 2016

@bilelz Thanks! Save me a lot time!

@cuonghuynh
Copy link

@bilelz Thank you so much

@o-cao
Copy link

o-cao commented Sep 5, 2016

@bilelz Thanks, works fine.

@bzin
Copy link

bzin commented Sep 26, 2016

Awesome stuff! Thanks @bilelz

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment