css - jquery mobile sidebar not expected drag -
i'm working on phonegap app has fixed sidebar behind page , found behavior issue.
the sidebar hidden, user can see tap on menu icon. when user tap on icon page go right , shows sidebar in minor z-index.
if user want close menu have drag visible part of page left.
my problem in sidebar have block vertically scrollable. works fine thing is, if put .scroll (overflow-y: scroll; -webkit-overflow-scrolling: touch;) class in element , user swipe horizontally right left on sidebar , page start drag.
we're using snap.js sidebar interaction.
i want disable drag. tried css , preventing horizontal scroll doesn't work.
i attach pic more visual details.
use iscroll5 scrolling. hook onscrollstart event:
myscroll.on('beforescrollstart', function(event) { if (ispanelopen){ myscroll.disable(); } else{ myscroll.enable(); } });
or - if not wanna use iscroll5, can set global bool, indicates, if panel open (you've gotta anyway). if panel open (meaning, you're showing sidebar) set bool true in snap.js - subsequently means, you've gotta tweak snap.js. then, on touchmove, check bool if true. know, panel open, , can event.stoppropagation on touchmove in order prevent event bubbling recognized snap.js , avoid panels closes early.
Comments
Post a Comment