donmbelembe/vue-dragscroll

Native vertical Scroll and Horizontal Dragscroll

Opened this issue · 5 comments

Hello,
is it possible to use dragscroll only for horizontal scrolling and to normally scroll vertically on touch displays.

I have a table that is bigger than screen size, so at some point I can't scroll further vertically.

When I open the examples here on mobile: https://donmbelembe.github.io/vue-dragscroll/
while dragging through any element, the vertical scroll is deactivated, even on X-Axis only draggscrolls.

Thanks!

Same problem.

I wrote this replay too many times...
For me worked setting a custom breakpoint at 790px, under which the directive is disabled.
Setting the directive on the container

v-dragscroll="{ active: drag }"

drag as a computed properties

drag(){ return (this.windowWidth>'790')?true:false; },

and this windowWidth ad a data updated on mounted

window.onresize = () => { this.windowWidth = window.innerWidth }

Also setting the container css:
overflow-x: auto; -webkit-overflow-scrolling:

Thanks, i should try that.

-webkit-overflow-scrolling: is only supported by 1 version of 2 browsers or something, not great. Does not work on my Firefox mobile.

JR75 commented

Hello,

Don't know if anyone has still this problem.
I did a simple solution - not perfect but he does the job :
Add this event @dragscrollmove="keepScrollY($event)"

keepScrollY(e){
window.scrollTo(0,window.scrollY + e.detail.deltaY);
},

I am just scrolling the window while your are on the dragscroll