jScrollPane on touch devices - drag button is in reverse

594 views Asked by At

I've implemented jScrollPane and I'm having an issue on touch devices.

The example I'm using is http://jscrollpane.kelvinluck.com/drag_size.html where I have a vertical scroll using a circular button image for the scroll on the track. The class that's added to this is jspDrag.

On desktop, when you click and scroll the vertical button, it drags down and the content scrolls up, which is natural in my eyes. The issue I'm facing is on touch devices (check the example URL above in Chrome using iPhone/iPad emulation in dev. tools) where you can't actually drag the button down - you actually have to scroll it up for the content to scroll?!
Users are definitely not going to know this as it's a button rather than a content block that you're using as a control.

I'd like to be able to touch and drag the button down on touch devices, rather than up, to make the content scroll.

Has any one come across this issue and managed to solve it? I've searched SO and Google Groups with no luck.

Thanks.

1

There are 1 answers

1
DT.DTDG On

Unfortunately jScrollPane seems to just work like this, with an annoying caveat, which is unfortunate - I really liked the plugin.

I came across http://manos.malihu.gr/jquery-custom-content-scroller/ which functions the way it should and runs super smooth on touch devices.